/* EceTempo — site.css */
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bricolage Grotesque";font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/instrument-sans-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(../fonts/instrument-sans-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --bg:#F3FAF6; --bg2:#E6F5EC; --surface:#fff; --ink:#0B1B2B; --muted:#4A5A6A; --line:#D5E5DB;
  --green:#17C26C; --green-ink:#07793F; --on-green:#04210F; --blue:#1F6FEB; --red:#E5383B; --amber:#F2A33A;
  --shadow:0 1px 2px rgba(11,27,43,.06),0 12px 32px -12px rgba(11,27,43,.18);
  --r:20px; --font-d:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif; --font-b:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#09131B; --bg2:#0E1D28; --surface:#112230; --ink:#EAF4EE; --muted:#9FB3C2; --line:#1F3444; --green-ink:#4EDC91; --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 32px -12px rgba(0,0,0,.6); color-scheme:dark}}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.65 var(--font-b);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--green-ink);text-underline-offset:3px}
a:hover{color:var(--ink)}
h1,h2,h3{font-family:var(--font-d);line-height:1.12;letter-spacing:-.02em;margin:0 0 .5em;font-weight:700;text-wrap:balance}
h1{font-size:clamp(2.2rem,5.4vw,3.9rem)} h2{font-size:clamp(1.6rem,3.2vw,2.3rem)} h3{font-size:1.2rem;letter-spacing:-.01em}
p{margin:0 0 1em;text-wrap:pretty}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.narrow{max-width:760px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;background:var(--ink);color:var(--bg);padding:10px 14px;border-radius:10px;z-index:100}
.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.small{font-size:.9rem;color:var(--muted)} .mono{font-family:ui-monospace,Menlo,Consolas,monospace}
.eyebrow{font:600 .8rem/1 var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:var(--green-ink);margin:0 0 14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.eyebrow a{text-transform:none;letter-spacing:0;font-size:.95rem}
.pill{background:var(--ink);color:var(--bg);padding:5px 10px;border-radius:99px;letter-spacing:.06em;font-size:.7rem}
.lead{font-size:1.15rem;color:var(--muted)}
.textlink{font-weight:600}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
.nav__in{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand img{border-radius:10px}
.wordmark{font:700 1.35rem/1 var(--font-d);letter-spacing:-.03em}.wordmark b{color:var(--green)}
.nav__menu{display:flex;align-items:center;gap:6px}
.nav__menu a:not(.btn){color:var(--ink);text-decoration:none;padding:9px 12px;border-radius:10px;font-weight:500;font-size:.96rem}
.nav__menu a:not(.btn):hover{background:var(--bg2)}
.nav__menu a[aria-current=page]{background:var(--bg2);font-weight:600}
.nav__lang{border:1px solid var(--line);margin-left:6px}
.nav__toggle{display:none;background:none;border:1px solid var(--line);border-radius:12px;width:46px;height:46px;cursor:pointer;position:relative;color:var(--ink)}
.nav__toggle i,.nav__toggle i::before,.nav__toggle i::after{position:absolute;left:13px;right:13px;height:2px;background:currentColor;border-radius:2px;content:"";transition:.2s}
.nav__toggle i{top:22px}.nav__toggle i::before{left:0;right:0;top:-7px}.nav__toggle i::after{left:0;right:0;top:7px}
.nav__toggle[aria-expanded=true] i{background:transparent}.nav__toggle[aria-expanded=true] i::before{top:0;transform:rotate(45deg)}.nav__toggle[aria-expanded=true] i::after{top:0;transform:rotate(-45deg)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:var(--on-green)!important;font:600 1rem/1 var(--font-b);padding:16px 26px;border-radius:99px;text-decoration:none;border:2px solid var(--green);box-shadow:0 10px 24px -10px color-mix(in srgb,var(--green) 70%,transparent);transition:transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px -10px color-mix(in srgb,var(--green) 80%,transparent)}
.btn--sm{padding:10px 18px;font-size:.92rem}
.btn--ghost{background:transparent;color:var(--ink)!important;border-color:var(--ink);box-shadow:none}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 14px}

/* hero */
.hero{padding:clamp(36px,6vw,84px) 0 clamp(36px,5vw,64px);background:radial-gradient(1100px 520px at 85% 0,color-mix(in srgb,var(--green) 22%,transparent),transparent 60%),radial-gradient(700px 400px at 0 100%,color-mix(in srgb,var(--blue) 12%,transparent),transparent 60%)}
.hero__in{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,5vw,72px);align-items:center}
.hero__sub{font:600 1.35rem/1.35 var(--font-d);color:var(--green-ink);margin:0 0 18px}
.hero__note{font-size:.88rem;color:var(--muted)}
.hero__img{position:relative;display:grid;place-items:center}
.hero__shot{width:min(100%,430px);border-radius:32px;box-shadow:var(--shadow);position:relative}
.blob{position:absolute;inset:6% 4%;border-radius:46% 54% 50% 50%/55% 45% 55% 45%;background:conic-gradient(from 200deg,var(--green),#3A8BFF,#FF5C5C,var(--green));filter:blur(56px);opacity:.28}

/* sections */
.sec{padding:clamp(48px,7vw,96px) 0}
.sec--tint{background:var(--bg2)}
.sechead{max-width:760px;margin-bottom:34px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.feat__n{font:700 .85rem var(--font-d);color:var(--green-ink);letter-spacing:.1em}
.feat h3{margin:.4em 0 .5em;font-size:1.3rem}.feat p{margin:0;color:var(--muted)}
.split{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,5vw,72px);align-items:center}
.stat{background:var(--ink);color:var(--bg);border-radius:28px;padding:36px;text-align:center}
.stat b{display:block;font:700 clamp(4.5rem,11vw,8rem)/.9 var(--font-d);letter-spacing:-.05em;color:var(--green)}
.stat span{display:block;font:600 1.4rem var(--font-d);margin-bottom:14px}.stat small{opacity:.8;font-size:.9rem;line-height:1.4;display:block}
.stat .cite a{color:inherit}
.prose p,.prose li{max-width:72ch}
.prose h2{font-size:1.5rem;margin-top:1.6em}.prose h3{margin-top:1.4em}
.prose .formula,.formula{font:600 1.05rem/1.5 ui-monospace,Menlo,Consolas,monospace;background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--green);border-radius:12px;padding:14px 18px;margin:12px 0;max-width:72ch;overflow-wrap:anywhere}
sup.cite{font-size:.72em;line-height:0;margin-left:1px}sup.cite a{text-decoration:none;font-weight:600}

/* feedback */
.fbrow{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,40px);margin:12px 0 36px}
.fb{margin:0;text-align:center}
.fb figcaption{margin-top:18px}.fb figcaption span{display:block;font:600 1.05rem var(--font-d)}.fb figcaption small{color:var(--muted);font-size:.95rem}
.watch{width:min(100%,230px);aspect-ratio:184/224;margin:0 auto;border-radius:22%;padding:8px;background:linear-gradient(145deg,#4a5560,#151b21);box-shadow:var(--shadow),inset 0 0 0 2px #0006}
.watch__screen{height:100%;border-radius:17%;display:grid;grid-template-rows:1fr auto auto;place-items:center;text-align:center;color:#fff;padding:14px 12px 16px;position:relative;overflow:hidden}
.watch--blue .watch__screen{background:#0A84FF}.watch--green .watch__screen{background:#2FD158}.watch--red .watch__screen{background:#FF3B30}
.watch__hr{font:700 clamp(3.2rem,8vw,4.4rem)/1 var(--font-d);align-self:end;letter-spacing:-.04em}
.watch__unit{font-weight:600;opacity:.95}
.watch__msg{font:700 1.15rem/1.1 var(--font-d);text-transform:uppercase;margin-top:4px}
.watch__bar{position:absolute;right:12px;top:22%;bottom:16%;width:7px;border-radius:9px;background:#fff6}
.watch__bar::after{content:"";position:absolute;inset:auto 0 0 0;height:55%;background:#fff;border-radius:9px}
.fbextra{display:grid;grid-template-columns:repeat(2,minmax(0,300px));gap:22px;justify-content:center;margin-top:34px}
.shot__img{border-radius:24px;box-shadow:var(--shadow);width:100%}

/* gallery */
.gallery{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px max(16px,calc((100vw - 1180px)/2)) 30px;scrollbar-width:thin;overscroll-behavior-x:contain}
.shot{flex:0 0 min(300px,72vw);scroll-snap-align:center;margin:0}
.shot img{border-radius:26px;box-shadow:var(--shadow);width:100%;height:auto;background:var(--surface)}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:20px;counter-reset:s}
.steps li{display:grid;grid-template-columns:56px 1fr;gap:18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.steps__n{width:56px;height:56px;border-radius:18px;background:var(--green);color:var(--on-green);display:grid;place-items:center;font:700 1.6rem var(--font-d)}
.steps h3{margin:.2em 0 .4em}.steps p{margin:0;color:var(--muted)}

/* safety */
.safety{display:grid;grid-template-columns:56px 1fr;gap:18px;border:2px solid var(--red);background:color-mix(in srgb,var(--red) 7%,var(--surface));border-radius:var(--r);padding:26px;margin:0 0 40px}
.safety__ico{width:48px;height:48px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;font:700 1.6rem var(--font-d)}
.safety h2{font-size:1.5rem;margin-bottom:.4em}.safety__body p:last-child{margin-bottom:0}
.safety__disc{margin-top:14px;padding-top:14px;border-top:1px dashed var(--red);font-weight:600}
.safety--inline{margin:0;max-width:900px;margin-inline:auto}

/* teasers */
.tease{text-decoration:none;color:var(--ink);position:relative;display:block;transition:transform .15s}
.tease:hover{transform:translateY(-3px);color:var(--ink)}
.tease h3{margin-bottom:.4em}.tease p{color:var(--muted);margin:0 0 22px}.tease__go{font:700 1.5rem var(--font-d);color:var(--green-ink)}

/* start */
.start{background:var(--ink);color:var(--bg)}
.start a:not(.btn){color:var(--green)}
.start .eyebrow{color:var(--green)}
.start__in{display:grid;grid-template-columns:1fr auto;gap:clamp(24px,5vw,64px);align-items:center}
.qr{margin:0;background:#fff;border-radius:24px;padding:18px;text-align:center;color:#0B1B2B}
.qr img{border-radius:10px}.qr figcaption{font-size:.85rem;margin-top:8px}
.start .btn--ghost{color:var(--bg)!important;border-color:var(--bg)}

/* page header + docs */
.phead{padding:clamp(36px,5vw,72px) 0 18px;background:radial-gradient(900px 300px at 90% 0,color-mix(in srgb,var(--green) 18%,transparent),transparent 70%)}
.phead h1{font-size:clamp(2rem,4.6vw,3.2rem);max-width:20ch}.phead .lead{max-width:62ch;margin:0}
.doc{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,5vw,64px);padding-block:30px 90px;align-items:start}
.doc--one{grid-template-columns:minmax(0,1fr)}
.toc{position:sticky;top:92px;font-size:.93rem}
.toc h2{font:600 .78rem var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.toc ol{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)}
.toc a{display:block;padding:7px 0 7px 14px;margin-left:-2px;border-left:2px solid transparent;color:var(--ink);text-decoration:none;line-height:1.3}
.toc a:hover,.toc a.on{border-left-color:var(--green);color:var(--green-ink);font-weight:600}
.doc__main{min-width:0}
.blk{margin:0 0 64px}.blk>h2{padding-bottom:12px;border-bottom:2px solid var(--line);margin-bottom:1em}
.blk h3{margin-top:1.8em}
.blk .prose p,.blk>p{max-width:74ch}
.table-wrap{overflow-x:auto;margin:18px 0;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
table{border-collapse:collapse;width:100%;font-size:.97rem}
th,td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{background:var(--bg2);font-weight:600;font-size:.88rem}tr:last-child td{border-bottom:0}
.callout{border-left:5px solid var(--red);background:color-mix(in srgb,var(--red) 7%,var(--surface));border-radius:0 14px 14px 0;padding:18px 22px;margin:14px 0}.callout p{margin:0 0 .7em}.callout p:last-child{margin:0}
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}
.strip figure{margin:0;text-align:center}.strip img{border-radius:14px;width:100%;height:auto;box-shadow:var(--shadow)}.strip figcaption{font-size:.86rem;color:var(--muted);margin-top:8px}
.shots{display:grid;grid-template-columns:repeat(2,minmax(0,280px));gap:20px;margin:18px 0}
.plain{padding-left:1.1em}

/* zones */
.zones{list-style:none;margin:20px 0 6px;padding:0;display:grid;gap:12px}
.zone{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px 20px;display:grid;grid-template-columns:minmax(200px,1fr) 2fr;gap:6px 24px;align-items:center}
.zone__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.zone__dot{width:14px;height:14px;border-radius:50%;background:var(--c)}
.zone__hrr{margin-left:auto;font:600 .9rem ui-monospace,Menlo,monospace;color:var(--muted)}
.zone__bar{height:12px;border-radius:9px;background:var(--bg2);position:relative;overflow:hidden}
.zone__bar i{position:absolute;top:0;bottom:0;left:calc(var(--lo)*1%);width:calc(var(--w)*1%);background:var(--c);border-radius:9px}
.zone__feel{grid-column:1/-1;margin:0;color:var(--muted);font-size:.95rem}
.zones__axis{display:flex;justify-content:space-between;font-size:.78rem;color:var(--muted);padding:0 4px;margin-bottom:18px}

/* calculator */
.calc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:26px;margin:28px 0;box-shadow:var(--shadow)}
.calc h3{margin-top:0}.calc__sub{color:var(--muted)}
.calc__form{display:flex;gap:16px;flex-wrap:wrap;margin:14px 0}
.calc label{display:grid;gap:6px;font-weight:600;font-size:.92rem}
.calc input{font:600 1.2rem var(--font-b);width:150px;padding:12px 14px;border:2px solid var(--line);border-radius:12px;background:var(--bg);color:var(--ink)}
.calc input:focus{border-color:var(--green);outline:0}
.calc__err{color:var(--red);font-weight:600;margin:0 0 10px}
.calc__meta{display:flex;gap:28px;flex-wrap:wrap;margin:0 0 6px}.calc__meta div{display:grid}.calc__meta dt{font-size:.82rem;color:var(--muted)}.calc__meta dd{margin:0;font:700 1.5rem var(--font-d)}
.calc__table td:first-child{font-weight:600}.calc__table .dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px}
.calc__note{font-size:.88rem;color:var(--muted);margin:0}

/* faq + refs */
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:14px;margin-bottom:10px}
.faq summary{cursor:pointer;padding:18px 22px;font:600 1.05rem var(--font-d);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font-size:1.5rem;line-height:1;color:var(--green-ink)}
.faq details[open] summary::after{content:"–"}
.faq__a{padding:0 22px 18px}.faq__a p{max-width:70ch}
.refs{padding-left:1.6em}.refs li{margin-bottom:14px;scroll-margin-top:90px}.refs li:target{background:color-mix(in srgb,var(--green) 18%,transparent);border-radius:8px}
.refs a{white-space:nowrap;font-weight:600;font-size:.92rem}

/* legal */
.draft{background:#FFF3C4;color:#4B3A00;border:2px solid #E8C200;border-radius:14px;padding:14px 18px;font-weight:600;margin-bottom:26px}
mark.todo{background:#FFE45C;color:#3B2F00;padding:1px 5px;border-radius:5px;font-weight:600;outline:1px dashed #B58A00}
.legaltext h2{font-size:1.45rem;margin-top:2em;padding-top:.6em;border-top:1px solid var(--line)}.legaltext h2:first-child{border-top:0;margin-top:0}
.legaltext ul{padding-left:1.2em}

/* footer */
.foot{background:var(--bg2);border-top:1px solid var(--line);padding:56px 0 24px}
.foot__grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:32px}
.foot h2{font:600 .78rem var(--font-b);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.foot ul{list-style:none;padding:0;margin:0}.foot li{margin-bottom:8px}.foot a{color:var(--ink)}
.foot__med{font-size:.88rem;color:var(--muted);max-width:42ch}
.foot__co{display:flex;gap:12px;align-items:center;font-size:.9rem;color:var(--muted);margin-top:18px}.foot__co img{width:auto;height:70px}
.foot__base{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:36px;padding-top:18px;font-size:.82rem;color:var(--muted)}.foot__base p{margin:0;max-width:70ch}

/* chooser */
.chooser{display:grid;place-items:center;min-height:100vh;text-align:center}
.chooser__in{padding:32px}.chooser__in img{margin:0 auto 18px;border-radius:26px;box-shadow:var(--shadow)}.chooser__in h1{font-size:3rem;margin:0 0 .3em}.chooser .cta{justify-content:center}

@media (max-width:980px){
  .hero__in,.split,.start__in{grid-template-columns:1fr}
  .hero__img{order:-1}.hero__shot{width:min(78%,340px)}
  .grid3{grid-template-columns:1fr}.steps{grid-template-columns:1fr}
  .fbrow{grid-template-columns:1fr;max-width:300px;margin-inline:auto}
  .doc{grid-template-columns:1fr}.toc{position:static;border:1px solid var(--line);border-radius:14px;padding:16px;background:var(--surface)}
  .toc ol{border:0}.foot__grid{grid-template-columns:1fr 1fr}.foot__about{grid-column:1/-1}
  .nav__toggle{display:block}
  .nav__menu{position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:12px 16px 20px;display:none;gap:4px}
  .nav__menu.open{display:flex}.nav__menu a:not(.btn){padding:14px 12px}.nav__lang{margin:6px 0 0}.nav__menu .btn{margin-top:8px}
  .strip{grid-template-columns:repeat(2,1fr)}
  .zone{grid-template-columns:1fr}
}
@media (max-width:560px){
  body{font-size:16px}.fbextra,.shots{grid-template-columns:1fr 1fr;gap:12px}.foot__grid{grid-template-columns:1fr}
  .safety{grid-template-columns:1fr}.btn{width:100%}.cta{flex-direction:column}.nav__menu .btn{width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.nav,.foot,.toc,.cta{display:none}body{background:#fff}}