/* adren.ai's industry pages (/es/industrias/, /industries/) and the homes' teaser: only what
   site.css does not already give. Built pages: scripts/build_industries.py.
   Motion: only transform, opacity and stroke-dashoffset move; without the script everything is
   at rest and readable; under reduced motion every loop stops and the day is a plain list. */

/* ================================================================ shared */
.ico{width:24px;height:24px;flex:none;stroke:currentColor;stroke-width:1.6}
.ico path{fill:none}
.js-rv .rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0ms)}
.js-rv .rv.is-in{opacity:1;transform:none}
.crumbs{display:flex;gap:8px;margin-bottom:20px;font-size:14px;color:var(--text-2)}
.crumbs a{color:var(--text-2)}
.crumbs a:hover{color:var(--text-1)}
.lede{margin-top:16px;max-width:62ch;color:var(--text-2)}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--r-pill);
  font:500 12px/1 var(--font-sans);letter-spacing:.01em;background:var(--mist);color:var(--text-1)}
.chip--disponible{background:var(--granite);color:var(--snow)}
.chip--piloto{background:var(--accent);color:var(--snow)}
.chip--star{background:var(--granite);color:var(--snow)}
.chip--soon{background:transparent;box-shadow:inset 0 0 0 1px var(--hairline-strong);color:var(--text-2)}
.card-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--tint,var(--mist));color:var(--accent)}
.card-ico .ico{width:22px;height:22px;stroke-width:1.7}
.dock--solid{animation:none}

/* the one form */
.ind-search input,.lead input,.lead select,.lead textarea{width:100%;box-sizing:border-box;min-height:48px;padding:12px 16px;
  border-radius:var(--r-input);border:1px solid var(--hairline-strong);background:#fff;color:var(--text-1);font:400 16px/24px var(--font-sans)}
.ind-search input:focus-visible,.lead input:focus-visible,.lead select:focus-visible,.lead textarea:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.lead{display:grid;gap:16px;max-width:720px}
.lead__h{margin:8px 0 0}
.lead__p{margin:0;color:var(--text-2);max-width:60ch}
.lead__field{display:grid;gap:6px;font-size:14px;color:var(--text-2)}
.lead__row{display:grid;gap:16px;grid-template-columns:1fr}
.lead textarea{min-height:96px;resize:vertical}
.lead .btn{justify-self:start}
.lead__note{margin:0;font-size:13px;color:var(--text-2)}
.lead__trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}

/* ================================================================ the index */
.ind-hero{padding-top:clamp(120px,14vw,180px)}
.ind-hero .sub{margin-top:20px;max-width:60ch}
.ind-hero .h-display,.ind-hero .sub{animation:rise .8s var(--ease) both}
.ind-hero .sub{animation-delay:.12s}
@keyframes rise{from{opacity:.001;transform:translateY(14px)}}
.ind-search{display:grid;gap:8px;margin-top:36px;max-width:520px;font-size:14px;color:var(--text-2)}
.ind-none{margin-top:16px;color:var(--text-2)}
.ind-group+.ind-group{margin-top:56px}
.ind-group__h{display:flex;align-items:center;gap:10px;font:600 14px/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);margin:0 0 20px}
.ind-group__h .ico{width:20px;height:20px;color:var(--accent)}
.ind-grid{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:1fr}
.ind-card[hidden],.ind-group[hidden]{display:none}
.ind-card__link{position:relative;display:flex;flex-direction:column;gap:10px;height:100%;box-sizing:border-box;padding:24px;border-radius:var(--r-card);
  background:#fff;box-shadow:inset 0 0 0 1px var(--hairline);color:inherit;text-decoration:none;transition:transform var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease)}
.ind-card__link:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--hairline-strong),0 20px 44px -28px rgb(35 42 47 / .4)}
.ind-card__link .chip{align-self:flex-start}
.ind-card__link p{color:var(--text-2);margin:0}
.ind-card__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ind-card__chips{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.chip--nfc{background:transparent;box-shadow:inset 0 0 0 1px var(--hairline-strong);color:var(--text-2)}
.ind-card__top .ico{color:var(--accent);transition:transform .5s var(--ease)}
.ind-card__link:hover .ind-card__top .ico{transform:rotate(-8deg) scale(1.12)}
.ind-card__go{position:absolute;right:20px;bottom:20px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--granite);color:var(--snow);opacity:0;transform:translateX(-6px);transition:opacity var(--t-fast) var(--ease),transform var(--t-fast) var(--ease)}
.ind-card__go svg{width:12px;height:12px}
.ind-card__link:hover .ind-card__go,.ind-card__link:focus-visible .ind-card__go{opacity:1;transform:none}
.ind-card .card-ico{width:40px;height:40px}
.ind-card[class*=" t-"] .ind-card__link{box-shadow:inset 0 0 0 1px var(--hairline),inset 0 3px 0 var(--accent)}
.ind-card__book{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:6px;font:500 14px/1 var(--font-sans);color:var(--accent)}
.ind-card__book::after{content:"→";transition:transform var(--t-fast) var(--ease)}
.ind-card__link:hover .ind-card__book::after{transform:translateX(4px)}
.ind-hero--index{overflow:hidden}
.marqs{display:grid;gap:10px;margin-top:56px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.marq{display:flex;width:max-content}
.marq__list{display:flex;gap:10px;margin:0;padding:0 10px 0 0;list-style:none;animation:marq 90s linear infinite}
.marq--rev .marq__list{animation-direction:reverse;animation-duration:110s}
.marq__list li{white-space:nowrap;padding:10px 18px;border-radius:var(--r-pill);background:#fff;box-shadow:inset 0 0 0 1px var(--hairline);font-size:15px;color:var(--text-2)}
@keyframes marq{to{transform:translateX(-100%)}}
.cat-nav{padding-block:0 8px}
.cat-nav__row{display:flex;flex-wrap:wrap;gap:8px}
.cat-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 10px;border-radius:var(--r-pill);background:#fff;box-shadow:inset 0 0 0 1px var(--hairline);color:var(--text-1);text-decoration:none;font-size:14px;transition:transform var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease)}
.cat-chip:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--hairline-strong)}
.cat-chip .ico{width:18px;height:18px;color:var(--accent)}
.cat-chip__n{font-size:12px;color:var(--text-2)}
@media (min-width:640px){
  .ind-grid,.lead__row{grid-template-columns:repeat(2,1fr)}
  .marq__list li{font-size:16px}
}
@media (min-width:1024px){.ind-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:639px){
  .cat-nav__row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter)}
  .cat-nav__row::-webkit-scrollbar{display:none}
  .cat-chip{flex:none;white-space:nowrap}
}

/* ================================================================ the homes' teaser */
.home-ind{list-style:none;margin:0 0 32px;padding:0;display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
.home-ind__tile a{display:flex;align-items:center;gap:12px;height:100%;box-sizing:border-box;padding:16px;border-radius:var(--r-card);background:#fff;
  box-shadow:inset 0 0 0 1px var(--hairline),inset 0 3px 0 var(--accent);color:var(--text-1);text-decoration:none;font-weight:500;
  transition:transform var(--t-fast) var(--ease),box-shadow var(--t-fast) var(--ease)}
.home-ind__tile a:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--hairline-strong),inset 0 3px 0 var(--accent),0 20px 40px -26px rgb(35 42 47 / .45)}
.home-ind__tile a:hover .card-ico{transform:rotate(-8deg) scale(1.08)}
.home-ind__tile .card-ico{transition:transform .5s var(--ease)}
.ind-teaser{padding-block:clamp(64px,8vw,120px)}
.ind-teaser .btn{margin-top:20px}
.ind-teaser__wrap{display:grid;gap:8px;justify-items:start}
.ind-teaser__link{display:inline-flex;align-items:center;gap:16px;color:inherit;text-decoration:none}
.ind-teaser__link .btn__go{width:44px;height:44px}
@media (min-width:1024px){.home-ind{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ================================================================ one industry (28 Oct, Marble-grade)
   docs/research/08-marble-diseno.md. One accent per page (--accent, --tint from
   industries-themes.css); a warm near-white ground; the render's own ground (--clay) behind the
   hero and the day; hairlines between sections; light display weights, never tighter than
   -.022em (so "rn" never reads as "m"). */
.ip{--clay:#F0EDEA;--accent-ink:color-mix(in srgb,var(--accent) 80%,#000);--ip-ground:#F7F6F4;--ink-soft:rgb(35 42 47 / .7);background:var(--ip-ground)}
.ip main{background:var(--ip-ground)}
.themed .btn--primary{background:var(--accent);color:#fff}
.themed .chip--disponible{background:var(--accent);color:#fff}
.ip-sec{position:relative;padding:clamp(80px,10vw,152px) 0;background:var(--ip-ground);box-shadow:inset 0 1px 0 var(--hairline)}
.ip-sec--tint{background:var(--tint)}
.ip-head{max-width:860px}
.ip-split{display:grid;gap:40px}
.ip-eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 18px;font:600 12px/16px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
.ip-eyebrow .chip{letter-spacing:.02em;text-transform:none}
.ip-h2{font:380 clamp(32px,2.1vw + 22px,58px)/1.08 var(--font-sans);letter-spacing:-.022em;color:var(--text-1);text-wrap:balance;max-width:22ch}
.ip-h3{font:500 20px/1.3 var(--font-sans);letter-spacing:-.012em;color:var(--text-1);text-wrap:balance}
.ip-p{margin-top:16px;font-size:17px;line-height:1.6;color:var(--ink-soft);max-width:56ch}
.ip-note{margin-top:16px;font-size:14px;color:var(--ink-soft)}
.ip-acc{color:var(--accent)}

/* ---- buttons: solid in the accent, and an outline */
.btn--line{padding:0 22px 0 24px;background:transparent;color:var(--text-1);box-shadow:inset 0 0 0 1px rgb(35 42 47 / .3)}
.btn--line:hover{box-shadow:inset 0 0 0 1px var(--text-1)}
.btn__down{display:inline-block;transition:transform var(--t-fast) var(--ease)}
.btn--line:hover .btn__down{transform:translateY(2px)}

/* ---- the hero: the hook, the problem in one line, two buttons, the industry's render */
.ip-hero{position:relative;padding:clamp(104px,11vw,148px) 0 clamp(40px,6vw,88px);background:var(--clay);overflow:hidden}
.ip-hero__grid{display:grid;gap:28px;align-items:center}
.ip-kicker{margin:0;font:600 12px/16px var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-ink)}
.ip-display{margin-top:18px;font:330 clamp(40px,3.1vw + 24px,82px)/1.04 var(--font-sans);letter-spacing:-.022em;color:var(--text-1);text-wrap:balance;max-width:15ch}
.ip-lede{margin-top:24px;font-size:18px;line-height:1.6;color:var(--ink-soft);max-width:50ch}
.ip-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.ip-display,.ip-lede{animation:rise .8s var(--ease) both}
.ip-lede{animation-delay:.1s}
.ip-hero__art{position:relative;margin:0 calc(-1 * var(--gutter))}
.pic{position:relative}
.pic__img{display:block;width:100%;height:auto;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(transparent,#000 7%,#000 93%,transparent);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(transparent,#000 7%,#000 93%,transparent);mask-composite:intersect}
.pic--scene{padding:4% 6%}
.sc{display:block;width:100%;height:auto;overflow:visible}
.sc-floor{fill:#fff;stroke:rgb(35 42 47 / .1)}
.sc-slab-l{fill:#E6E2DE}.sc-slab-r{fill:#D9D4CF}
.sc-grid path{fill:none;stroke:rgb(35 42 47 / .07)}
.sc-top{fill:#fff;stroke:rgb(35 42 47 / .1)}.sc-l{fill:#ECE8E4}.sc-r{fill:#DFDAD5}
.sc-hi{fill:var(--accent);opacity:0;transition:opacity .6s var(--ease)}
.sc-cube.is-on .sc-hi{opacity:.22}
.sc-spoke{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-dasharray:3 7;animation:flow 2.4s linear infinite}
@keyframes flow{to{stroke-dashoffset:-20}}
.sc-hub{fill:var(--accent)}
.sc-shadow{fill:rgb(35 42 47 / .12)}
.sc-stem{stroke:rgb(35 42 47 / .25);stroke-width:1.5}
.sc-tag rect{fill:#fff;stroke:rgb(35 42 47 / .12)}
.sc-ico{fill:none;stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sc-tag{animation:bob 5s ease-in-out infinite}
.sc-cube:nth-of-type(2) .sc-tag{animation-delay:-1.2s}
.sc-cube:nth-of-type(3) .sc-tag{animation-delay:-2.5s}
.sc-cube:nth-of-type(4) .sc-tag{animation-delay:-3.7s}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
/* the floating product chips over the render */
.ip-chips{position:absolute;inset:0;pointer-events:none}
.ip-chip{position:absolute;display:flex;align-items:center;gap:10px;max-width:min(62%,300px);margin:0;padding:9px 12px;border-radius:14px;background:#fff;
  box-shadow:0 1px 2px rgb(35 42 47 / .06),0 18px 40px -22px rgb(35 42 47 / .4);font:500 12px/1.35 var(--font-sans);color:var(--text-1);animation:bob 6s ease-in-out infinite}
.ip-chip--a{left:5%;top:6%}
.ip-chip--b{right:4%;top:40%;animation-delay:-2s}
.ip-chip--c{left:9%;bottom:5%;animation-delay:-4s}
.ip-chip__k{display:block;font:600 10px/14px var(--font-sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.ip-chip__ok{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px}
.ip-chip__eye{color:var(--accent)}
.ip-chip__eye .ico{width:18px;height:18px}
.ip-chip__yes{flex:none;padding:5px 10px;border-radius:var(--r-pill);background:var(--accent);color:#fff;font-weight:600}

.ip-display--long{font-size:clamp(36px,2.4vw + 22px,64px);max-width:18ch}
.ip-display--xl{font-size:clamp(32px,1.7vw + 22px,54px);max-width:21ch}
.ip-hero__art .pic__img{transform:scale(1.12);transform-origin:50% 55%}
@media (max-width:767px){.ip-chip--c{display:none}.ip-chip--b{top:auto;bottom:8%}}
@media (min-width:1024px){
  .ip-hero__grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:24px}
  .ip-hero__art{margin:0 calc(-1 * var(--edge)) 0 -40px}
}
@media (prefers-reduced-motion:reduce){
  .marq__list,.sc-spoke,.sc-tag,.ip-chip{animation:none}
  .ind-hero .h-display,.ind-hero .sub,.ip-display,.ip-lede{animation:none}
  .js-rv .rv{opacity:1;transform:none;transition:none}
}
/* The rest of an industry page is in industry.css, linked after the hero so it does not hold
   up the first paint. */
/* the hero's render comes alive (industries.js): the clip starts on the render's own frame, so
   it fades in over it without a jump, plays once and holds its last frame */
.pic__vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s ease;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(transparent,#000 7%,#000 93%,transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(transparent,#000 7%,#000 93%,transparent);mask-composite:intersect;mix-blend-mode:multiply}
.pic__vid.is-on{opacity:1}

@media (prefers-reduced-motion:reduce){.pic__vid{display:none}}
.pic__img{transition:opacity .4s ease}
.pic.is-live .pic__img{opacity:0}