/* The home (dl_home.html), every market. Ported from design/mockups/home-concepts/h-symbols.html (Gates, 2026-10-25).
   Daylight tokens only (daylight.css); the grid closes up by the classes home_components.doors_class() writes.
   Content is visible without script: only under html.js-anim (home-tiles.js) does anything wait to animate in. */
.dlhome{--max:1240px;background:var(--canvas)}

/* the nav, dark over the night hero */
.dlhome .nav{background:#0B0F19;border-color:#1c2332;color:var(--canvas)}
.dlhome .nav .logo,.dlhome .nav .links a,.dlhome .nav .wrap>a:not(.btn){color:var(--canvas)}
.dlhome .nav .menu{color:var(--canvas);border-color:var(--canvas);background:none}
/* the phone menu drops a panel under the bar; daylight.css paints it cream, which hid the cream links above */
@media(max-width:1000px){.dlhome .nav.open .links{background:#0B0F19;border-bottom-color:#1c2332}.dlhome .nav.open .links a{border-bottom-color:#1c2332}}

/* HERO: the Gates scene behind the words. */
.dlhome .hero{--night:#0B0F19;background:var(--night);color:var(--canvas);position:relative;overflow:hidden;isolation:isolate;padding:0;border:0}
.dlhome .hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 90% at 70% 45%,transparent 40%,rgba(5,7,12,.55) 100%),linear-gradient(90deg,rgba(11,15,25,.92) 0%,rgba(11,15,25,.55) 34%,transparent 58%)}
.dlhome .hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.09;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.dlhome .hero>.wrap{position:relative;z-index:2;min-height:680px;display:flex;align-items:center;pointer-events:none}
.dlhome .hero .copy{pointer-events:auto;max-width:560px;padding:72px 0}
.dlhome .hero .kick{display:flex;align-items:center;gap:12px;color:#AEB6C2;padding:0}
.dlhome .hero .kick i{flex:none;width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px var(--lime);animation:hm-breathe 3s ease-in-out infinite}
.dlhome .hero .kick b{font-weight:600;color:var(--lime)}
@keyframes hm-breathe{50%{opacity:.35}}
.dlhome .hero h1{font-size:clamp(3rem,5.4vw,5.6rem);line-height:.9;margin:22px 0 14px;letter-spacing:-.005em;color:var(--canvas)}
.dlhome .hero h1 .l{display:block}.dlhome .hero h1 .k{color:var(--lime)}
.dlhome .hero p.brand{font:800 clamp(1.3rem,1.9vw,1.75rem)/1 var(--f-d);font-stretch:66%;text-transform:uppercase;letter-spacing:.01em;color:var(--canvas);margin:0 0 18px}
.dlhome .hero p.sub{font-size:1.15rem;line-height:1.5;max-width:23em;color:#C3CAD4}
.dlhome .hero .cta{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-top:34px}
.dlhome .hero .hint{color:#8C95A3;padding:0}
.dlhome .hero .extra:empty{display:none}
.dlhome .hero .trust{margin-top:22px;max-width:34em;font-size:.86rem;line-height:1.5;color:#AEB6C2;border-left:2px solid var(--lime);padding-left:12px}
.dlhome .wa{display:inline-flex;align-items:center;gap:10px;margin-top:18px;background:#25D366;color:#111827;padding:12px 18px;min-height:44px;font:700 .95rem var(--f-d);font-stretch:92%;text-decoration:none;box-shadow:4px 4px 0 #000}
.dlhome .hero .fade-in{opacity:0;transform:translateY(14px);animation:hm-rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.dlhome .hero .fade-in:nth-child(2){animation-delay:.08s}.dlhome .hero .fade-in:nth-child(3){animation-delay:.16s}
.dlhome .hero .fade-in:nth-child(4){animation-delay:.24s}.dlhome .hero .fade-in:nth-child(n+5){animation-delay:.32s}
@keyframes hm-rise{to{opacity:1;transform:none}}
.dlhome .stagebox{position:absolute;inset:0;z-index:0}
.dlhome #scene{position:absolute;inset:0;width:100%;height:100%;display:block}
.dlhome .glabels{position:absolute;inset:0;pointer-events:none}
.dlhome .glabel{position:absolute;left:0;top:0;display:none;opacity:0;transform:translate(-50%,-100%);font:600 .68rem var(--f-m);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;padding-bottom:8px}
.dlhome .glabel::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:6px;background:currentColor;opacity:.6}
.scene-on .dlhome .glabel{display:block}
.dlhome .legend{position:absolute;right:40px;bottom:26px;z-index:2;display:none;gap:22px;color:#7E8794;padding:0}
.scene-on .dlhome .legend{display:flex}
.dlhome .legend span{display:inline-flex;align-items:center;gap:9px}
.dlhome .legend i{width:14px;height:9px;border-radius:2px;background:#3B4456}.dlhome .legend i.k{background:var(--lime);box-shadow:0 0 10px rgba(223,255,104,.7)}
/* no scene (reduced motion, Save-Data, no WebGL, or before it arrives on a slow line): the flat mark */
.dlhome .fallback{position:absolute;right:16%;top:50%;transform:translateY(-50%) rotate(-4deg);width:200px;height:200px;display:none;opacity:.9}
.no-scene .dlhome .fallback{display:block}.no-scene .dlhome #scene{display:none}

/* DOORS */
.dlhome .doors{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;padding-top:56px;padding-bottom:72px}
.dlhome .d{grid-column:span 4;border:1.5px solid var(--ink);padding:24px;display:flex;flex-direction:column;gap:8px;text-decoration:none;color:var(--ink);min-width:0;min-height:250px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}
.dlhome a.d:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.dlhome .d .mono{padding:0;color:inherit}
.dlhome .d h2{font-size:2.5rem;position:relative;z-index:1}.dlhome .d p{position:relative;z-index:1;font-size:1rem}
.dlhome .d .go{margin-top:auto;font-weight:700;position:relative;z-index:1}.dlhome .d .go::after{content:" \2192"}.dlhome .d .go.out::after{content:" \2197"}
.dlhome .d .art{position:absolute;right:0;bottom:0;pointer-events:none}
.dlhome .jobs{grid-column:span 7;background:var(--cobalt);color:#fff;min-height:330px}
.dlhome .jobs .big{font:800 clamp(3.6rem,6vw,5.8rem)/.9 var(--f-d);font-stretch:62%;color:var(--lime);font-variant-numeric:tabular-nums}
.dlhome .jobs h2.jh{font-size:1.9rem}
.dlhome .jobs .bars{margin-top:14px;display:grid;gap:7px}
.dlhome .bar{display:grid;grid-template-columns:86px 1fr 74px;gap:10px;align-items:center;font:600 .7rem var(--f-m);letter-spacing:.06em;text-transform:uppercase}
.dlhome .bar .t{height:14px;background:rgba(255,255,255,.14);position:relative}
.dlhome .bar .t i{position:absolute;left:0;top:0;bottom:0;width:var(--w);background:var(--lime);transition:width 1.4s cubic-bezier(.2,.7,.3,1)}
.dlhome .bar:nth-child(2) .t i{transition-delay:.12s}.dlhome .bar:nth-child(3) .t i{transition-delay:.24s}
.dlhome .bar:nth-child(4) .t i{transition-delay:.36s}.dlhome .bar:nth-child(n+5) .t i{transition-delay:.48s}
.js-anim .dlhome .jobs:not(.in) .bar .t i{width:0}
.dlhome .bar b{text-align:right;font-variant-numeric:tabular-nums}
.dlhome .appline{font-size:.86rem;opacity:.85;margin-top:6px}
.dlhome .flats{grid-column:span 5;background:#F0DDD0}.dlhome .flats h2{color:var(--flats,#A94F2F)}
.dlhome .cars{background:#D6E7E8}.dlhome .cars h2{color:var(--cars,#0A4A52)}
.dlhome .checks{background:var(--lime)}
.dlhome .ai{background:var(--lav)}
.dlhome .ins{grid-column:span 12;background:var(--base);min-height:0;display:grid;grid-template-columns:5fr 7fr;gap:24px;align-items:center}
.dlhome .ins h2{font-size:clamp(2.2rem,3.6vw,3.4rem)}.dlhome .ins .go{display:block;margin-top:14px}
/* the grid closes up when a journey is absent (never an empty tile) */
.dlhome .j2 .flats,.dlhome .j2 .cars{grid-column:span 5}
.dlhome .j2 .checks,.dlhome .j2 .ai{grid-column:span 6}
.dlhome .j1 .jobs{grid-column:span 12}
.dlhome .j1 .ins{grid-column:span 4;display:flex;flex-direction:column;align-items:stretch}
.dlhome .j3.no-ai .cars,.dlhome .j3.no-ai .checks{grid-column:span 6}
.dlhome .j2.no-ai .checks{grid-column:span 12}
.dlhome .j1.no-ai .checks,.dlhome .j1.no-ai .ins{grid-column:span 6}
.dlhome .j3.no-checks .cars,.dlhome .j3.no-checks .ai{grid-column:span 6}
/* tile art */
.dlhome .sky path{fill:none;stroke:var(--flats,#A94F2F);stroke-width:2.5;stroke-dasharray:900;stroke-dashoffset:0;transition:stroke-dashoffset 2.4s cubic-bezier(.3,.7,.2,1)}
.js-anim .dlhome .flats:not(.in) .sky path{stroke-dashoffset:900}
.dlhome .sky rect{fill:#e6c6b3;transition:fill .4s}.dlhome .sky rect.on{fill:var(--lime);stroke:var(--ink);stroke-width:1.2}
.dlhome .carart{display:flex;flex-direction:column;gap:12px;margin:12px 0 6px;position:relative;z-index:1}
.dlhome .plate{position:relative;align-self:flex-start;background:#F7D117;border:2px solid var(--ink);border-radius:6px;padding:7px 16px 5px;font:800 2.2rem/1 var(--f-d);font-stretch:72%;letter-spacing:.07em;color:var(--ink);overflow:hidden;box-shadow:4px 4px 0 var(--cars,#0A4A52)}
.dlhome .plate span{display:inline-block;transition:filter .5s ease .8s,opacity .5s ease .8s}
.dlhome .plate .scan{position:absolute;top:-2px;bottom:-2px;left:-6%;width:3px;background:var(--cobalt);box-shadow:0 0 10px 2px rgba(36,72,232,.55);opacity:0}
.dlhome .cars.in .plate .scan{animation:hm-scan 6s cubic-bezier(.5,0,.3,1) .1s infinite}
@keyframes hm-scan{0%{left:-6%;opacity:1}16%{left:104%;opacity:1}17%,100%{left:104%;opacity:0}}
.dlhome .motrow{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dlhome .motrow .mono{color:var(--cars,#0A4A52);margin-right:4px}
.dlhome .motrow b{width:28px;height:28px;display:grid;place-items:center;font:800 .9rem var(--f-d);background:var(--cars,#0A4A52);color:#D6E7E8;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.dlhome .motrow b.adv{background:var(--coral);color:var(--ink)}
.dlhome .motrow b:nth-of-type(1){transition-delay:1.15s}.dlhome .motrow b:nth-of-type(2){transition-delay:1.25s}.dlhome .motrow b:nth-of-type(3){transition-delay:1.35s}
.dlhome .motrow b:nth-of-type(4){transition-delay:1.45s}.dlhome .motrow b:nth-of-type(5){transition-delay:1.55s}.dlhome .motrow b:nth-of-type(6){transition-delay:1.65s}
.js-anim .dlhome .cars:not(.in) .plate span{filter:blur(4px);opacity:.55}
.js-anim .dlhome .cars:not(.in) .motrow b{transform:scale(0)}
.dlhome .carart2{display:flex;gap:8px;align-items:flex-end;margin:12px 0 6px;position:relative;z-index:1}
.dlhome .carart2 .lc{width:74px;background:var(--base);border:1.5px solid var(--cars,#0A4A52);padding:8px 8px 6px;position:relative;transition:transform .5s cubic-bezier(.3,1.4,.5,1),opacity .5s}
.dlhome .carart2 .lc i{display:block;height:6px;background:#B9CED0;margin:0 0 5px}.dlhome .carart2 .lc i.s{width:55%}
.dlhome .carart2 .lc.n{border-color:var(--ink);box-shadow:3px 3px 0 var(--cars,#0A4A52)}
.dlhome .carart2 .lc b{position:absolute;right:-6px;top:-10px;font:700 .62rem var(--f-m);letter-spacing:.06em;text-transform:uppercase;background:var(--lime);color:var(--ink);padding:2px 6px}
.dlhome .carart2 .lc:nth-child(2){transition-delay:.15s}.dlhome .carart2 .lc:nth-child(3){transition-delay:.3s}
.js-anim .dlhome .cars:not(.in) .carart2 .lc{opacity:0;transform:translateY(12px)}
.dlhome .checks ul{list-style:none;position:relative;z-index:1}.dlhome .checks li{border-top:1px solid rgba(17,24,39,.2)}
.dlhome .checks li a{display:flex;justify-content:space-between;align-items:center;padding:10px 0;min-height:44px;font-weight:700;text-decoration:none}
.dlhome .checks li svg{width:18px;height:18px;flex:none}
.dlhome .checks li path{fill:none;stroke:var(--ink);stroke-width:3;stroke-dasharray:30;stroke-dashoffset:0;transition:stroke-dashoffset .4s}
.js-anim .dlhome .checks:not(.in) li path{stroke-dashoffset:30}
.dlhome .checks li:nth-child(2) path{transition-delay:.12s}.dlhome .checks li:nth-child(3) path{transition-delay:.24s}.dlhome .checks li:nth-child(n+4) path{transition-delay:.36s}
.dlhome .term{background:var(--ink);color:var(--lime);font:600 .9rem/1.5 var(--f-m);padding:12px 14px;margin-top:6px;position:relative;z-index:1;min-height:3em;overflow-wrap:anywhere}
.dlhome .term .c{display:inline-block;width:.55em;height:1em;background:var(--lime);vertical-align:-.15em;animation:hm-blink 1s steps(1) infinite}
@keyframes hm-blink{50%{opacity:0}}
.dlhome .wave{width:100%;height:120px;display:block}
.dlhome .wave .w1{fill:var(--cobalt);opacity:.9}.dlhome .wave .w2{fill:var(--lime)}

/* PROMISES: three lines that land one at a time */
.dlhome .prom{padding-top:20px;padding-bottom:76px}
.dlhome .prom ol{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dlhome .prom li{border-top:4px solid var(--ink);padding-top:14px;font:800 clamp(1.8rem,3vw,2.6rem)/.95 var(--f-d);font-stretch:62%;text-transform:uppercase;transition:opacity .6s,transform .6s}
.js-anim .dlhome .prom:not(.in) li{opacity:0;transform:translateY(24px)}
.dlhome .prom li:nth-child(2){transition-delay:.15s}.dlhome .prom li:nth-child(3){transition-delay:.3s}
.dlhome .prom li span{color:var(--cobalt)}

/* THE WEB APP BAND: a browser frame that receives what TUNAI did (example rows, no figures) */
.dlhome .app{background:var(--ink);color:var(--canvas);padding:64px 0;overflow:hidden}
.dlhome .app .wrap{display:grid;grid-template-columns:6fr 6fr;gap:40px;align-items:center}
.dlhome .app h2{font-size:clamp(2.6rem,5vw,4.8rem);color:var(--lime)}.dlhome .app p{margin:16px 0 24px;max-width:24em;color:#C9CFD8}
.dlhome .phone{width:100%;max-width:460px;height:340px;border:2px solid #3a4152;border-radius:12px;background:#0b0f18;padding:52px 16px 16px;position:relative;justify-self:center}
.dlhome .phone .addr{position:absolute;top:12px;left:56px;right:16px;height:24px;border-radius:6px;background:#1e2533;color:#98A1AE;font-size:.7rem;line-height:24px;padding:0 0 0 10px;text-transform:none;letter-spacing:.04em;overflow:hidden;white-space:nowrap}
.dlhome .phone::after{content:"";position:absolute;top:21px;left:16px;width:30px;height:7px;background:radial-gradient(circle,#3a4152 3px,transparent 3.5px) 0 0/10px 7px}
.dlhome .ntf{background:var(--base);color:var(--ink);padding:10px 12px;margin-bottom:10px;font-size:.84rem;line-height:1.3;border-left:5px solid var(--cobalt);transition:opacity .5s,transform .5s cubic-bezier(.3,1.4,.5,1)}
.js-anim .dlhome .ntf:not(.on){opacity:0;transform:translateY(-18px) scale(.96)}
.dlhome .ntf b{display:block;font:800 .95rem var(--f-d);font-stretch:80%}
.dlhome .ntf .mono{display:block;padding:0;font-size:.58rem;color:var(--ink2)}.dlhome .ntf.y{border-color:var(--lime)}.dlhome .ntf.c{border-color:var(--coral)}

/* FAQ in two closed columns (the FAQPage JSON-LD reads the same text) */
.dlhome .purpose{padding-bottom:48px}.dlhome .purpose p{max-width:46em;color:var(--ink2);font-size:.95rem;line-height:1.6}
.dlhome .faq2{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;align-items:start;padding-top:56px;padding-bottom:56px}
.dlhome .faq2>.mono{grid-column:1/-1;color:var(--ink2);margin-bottom:10px;padding:0}
.dlhome .faq2 details{border-top:1.5px solid var(--rule)}
.dlhome .faq2 summary{list-style:none;cursor:pointer;padding:14px 0;min-height:44px;font:800 1.2rem/1.1 var(--f-d);font-stretch:66%;text-transform:uppercase;display:flex;justify-content:space-between;gap:16px}
.dlhome .faq2 summary::-webkit-details-marker{display:none}
.dlhome .faq2 summary::after{content:"+";color:var(--cobalt)}.dlhome .faq2 details[open] summary::after{content:"\2212"}
.dlhome .faq2 details p{padding:0 0 18px;max-width:40em;font-size:1rem;line-height:1.55}

/* THE ARRIVAL CARD: a slim strip under the nav, never a modal, never over the page or the cookie bar */
.dlhome .arrive{background:var(--lime);color:var(--ink);border-bottom:1.5px solid var(--ink);position:relative;z-index:19;overflow:hidden}
.dlhome .arrive[hidden]{display:none}
.dlhome .arrive .wrap{display:flex;align-items:center;gap:18px;min-height:58px;padding-top:9px;padding-bottom:9px}
.dlhome .arrive .from{font:600 .66rem var(--f-m);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
.dlhome .arrive .from svg{width:15px;height:15px}
.dlhome .arrive .line{flex:1;font-weight:600;font-size:1rem;line-height:1.35}
.dlhome .arrive .go{display:inline-flex;align-items:center;gap:8px;background:var(--ink);color:var(--lime);font:700 .92rem var(--f-d);font-stretch:92%;padding:10px 16px;text-decoration:none;white-space:nowrap;min-height:44px}
.dlhome .arrive .go::after{content:"\2192"}
.dlhome .arrive .x{width:44px;height:44px;border:0;background:none;color:var(--ink);font:400 1.5rem/1 var(--f-d);cursor:pointer;flex:none}
.dlhome .arrive.in{animation:hm-arrive .5s cubic-bezier(.2,.8,.2,1)}
@keyframes hm-arrive{from{transform:translateY(-100%)}}

/* THIS WEEK: the fact the content engine posts this week in this market (interface/this_week.py); absent, nothing renders */
.dlhome .week{margin-top:-40px;padding-bottom:56px}
.dlhome .wk{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:10px 36px;align-items:center;border:1.5px solid var(--ink);border-left:10px solid var(--coral);background:var(--base);padding:24px 28px;color:var(--ink);text-decoration:none;transition:transform .2s,box-shadow .2s}
.dlhome a.wk:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ink)}
.dlhome .wk>.mono{grid-column:1/-1;padding:0;color:var(--ink2)}
.dlhome .wk .fig{font:800 clamp(3rem,5.4vw,5.2rem)/.9 var(--f-d);font-stretch:62%;color:var(--cobalt);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.dlhome .wk .txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.dlhome .wk .lead{font-size:1.2rem;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.dlhome .wk .cav{font-size:.95rem;color:var(--ink2);overflow-wrap:anywhere}
.dlhome .wk .read{padding:0;color:var(--ink2)}
.dlhome .wk .go{font-weight:700;margin-top:4px}.dlhome .wk .go::after{content:" \2192"}
@media(max-width:900px){
  .dlhome .week{margin-top:-28px;padding-bottom:36px}
  .dlhome .wk{grid-template-columns:1fr;padding:20px}
  .dlhome .hero{display:flex;flex-direction:column}
  .dlhome .hero>.wrap{min-height:0;order:0}.dlhome .hero .copy{padding:40px 0 0}.dlhome .hero h1{font-size:3rem}.dlhome .hero p.sub{font-size:1.04rem}
  .dlhome .hero::before{background:linear-gradient(180deg,rgba(11,15,25,.9) 0%,rgba(11,15,25,.4) 55%,transparent 75%)}
  .dlhome .stagebox{position:relative;inset:auto;height:340px;order:1;margin-top:-10px}
  .dlhome .fallback{right:50%;transform:translate(50%,-50%) rotate(-4deg);width:140px;height:140px}
  .dlhome .legend{right:16px;bottom:14px;gap:14px;font-size:.6rem}
  .dlhome .doors{grid-template-columns:1fr;gap:12px;padding-top:32px;padding-bottom:44px}
  .dlhome .doors .d{grid-column:1/-1;min-height:0}.dlhome .flats,.dlhome .cars{min-height:220px}
  .dlhome .bar{grid-template-columns:70px 1fr 64px}.dlhome .ins{grid-template-columns:1fr}
  .dlhome .prom ol{grid-template-columns:1fr}.dlhome .prom{padding-bottom:48px}.dlhome .sky{width:190px;height:82px;opacity:.7;position:relative;order:5;align-self:flex-end;margin:4px -24px -24px 0}
  .dlhome .app .wrap{grid-template-columns:1fr}.dlhome .phone{height:320px}
  .dlhome .faq2{grid-template-columns:1fr;padding-top:40px;padding-bottom:40px}
  .dlhome .arrive .wrap{flex-wrap:wrap;gap:6px 10px;padding-top:10px;padding-bottom:10px}
  .dlhome .arrive .from{order:1;flex:1}.dlhome .arrive .x{order:2;margin:-8px -10px -6px 0}
  .dlhome .arrive .line{order:3;flex-basis:100%;font-size:.95rem}
  .dlhome .arrive .go{order:4;flex:1;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
  .dlhome *{transition:none!important;animation:none!important}
  .dlhome .hero .fade-in,.dlhome .prom li,.dlhome .ntf{opacity:1;transform:none}
}
