/* ==========================================================================
   Dera Casas — design system (warm architectural)
   Limestone + ink + terracotta. See docs/DESIGN.md.
   ========================================================================== */

/* ---------- fonts (Unageo self-hosted; Fraunces via <link> in template) ---------- */
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Light.ttf') format('truetype'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Medium.ttf') format('truetype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Semibold.ttf') format('truetype'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Bold.ttf') format('truetype'); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Extrabold.ttf') format('truetype'); font-weight:800; font-style:normal; font-display:swap; }
@font-face { font-family:'Unageo'; src:url('../fonts/Unageo-Black.ttf') format('truetype'); font-weight:900; font-style:normal; font-display:swap; }

:root {
  --paper: oklch(0.988 0.006 75);
  --limestone: oklch(0.965 0.010 73);
  --surface: oklch(0.945 0.014 72);
  --line: oklch(0.895 0.012 70);
  --line-strong: oklch(0.82 0.014 68);

  --ink: oklch(0.245 0.020 55);
  --ink-soft: oklch(0.42 0.018 55);
  --muted: oklch(0.55 0.014 60);

  --clay: oklch(0.605 0.135 42);
  --clay-deep: oklch(0.515 0.130 40);
  --clay-tint: oklch(0.93 0.035 50);
  --catalog-red: oklch(0.55 0.17 25);
  --catalog-red-deep: oklch(0.47 0.17 25);

  --espresso: oklch(0.255 0.022 58);
  --espresso-2: oklch(0.195 0.020 55);
  --on-dark: oklch(0.965 0.010 75);
  --on-dark-soft: oklch(0.80 0.012 72);
  --hairline-dark: oklch(0.55 0.02 60 / 0.28);

  --sage: oklch(0.58 0.045 145);

  --shadow-sm: 0 1px 2px rgb(40 30 22 / 0.05), 0 2px 6px -2px rgb(40 30 22 / 0.07);
  --shadow: 0 2px 4px rgb(40 30 22 / 0.05), 0 14px 32px -16px rgb(40 30 22 / 0.16);
  --shadow-lg: 0 4px 8px rgb(40 30 22 / 0.06), 0 30px 60px -24px rgb(40 30 22 / 0.22);

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "Unageo", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --r-sm: 6px; --r: 12px; --r-lg: 18px; --r-pill: 999px;

  --container: 1200px; --container-wide: 1320px;
  --gutter: clamp(1.25rem, 5vw, 2.5rem);
  --section-y: clamp(4.5rem, 9vw, 8rem);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  font-family:var(--font-body); background:var(--paper); color:var(--ink);
  line-height:1.65; font-size:1.0625rem; font-weight:400;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden;
}
img, svg, video { display:block; max-width:100%; }
img { height:auto; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }
ul { list-style:none; }
::selection { background:var(--clay); color:var(--paper); }
:focus-visible { outline:2px solid var(--clay); outline-offset:2px; border-radius:3px; }

/* ---------- typography ---------- */
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:460; line-height:1.08; letter-spacing:-0.015em; color:var(--ink); font-optical-sizing:auto; }
.display { font-family:var(--font-display); font-weight:440; font-size:clamp(2.9rem,6vw,5.25rem); line-height:1.02; letter-spacing:-0.025em; }
.h2 { font-size:clamp(2rem,3.8vw,3.25rem); }
.h3 { font-size:clamp(1.35rem,2vw,1.6rem); line-height:1.2; }
p { max-width:66ch; }
.lead { font-size:clamp(1.1rem,1.6vw,1.3rem); line-height:1.6; color:var(--ink-soft); font-weight:400; }
.eyebrow { display:inline-flex; align-items:center; gap:0.6rem; font-family:var(--font-body); font-weight:600; font-size:0.78rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--clay); }
.eyebrow--light { color:oklch(0.82 0.09 55); }
.brick { display:inline-block; width:22px; height:auto; flex-shrink:0; }
.brick rect { fill:currentColor; }
.text-clay { color:var(--clay); }
.text-muted { color:var(--muted); }

/* ---------- layout ---------- */
.container { width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
.container--wide { max-width:var(--container-wide); }
.section { padding-block:var(--section-y); }
.section--tight { padding-block:clamp(3rem,6vw,5rem); }
.section--limestone { background:var(--limestone); }
.section--espresso { background:var(--espresso); color:var(--on-dark); }
.section-head { max-width:46rem; margin-bottom:clamp(2.5rem,5vw,4rem); }
.section-head--center { margin-inline:auto; text-align:center; }
.section-head .h2 { margin-top:0.9rem; }
.section-head p { margin-top:1.1rem; color:var(--ink-soft); }
.section-head--center p { margin-inline:auto; }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:0.6rem; font-family:var(--font-body); font-weight:600; font-size:0.95rem; letter-spacing:0.01em; padding:0.95rem 1.6rem; border-radius:var(--r-pill); border:1.5px solid transparent; transition:transform 0.25s var(--ease-out), background-color 0.25s var(--ease), color 0.25s var(--ease), border-color 0.25s var(--ease), box-shadow 0.25s var(--ease); white-space:nowrap; }
.btn:hover { transform:translateY(-2px); }
.btn:active { transform:translateY(0); }
.btn i { font-size:0.9em; }
.btn--primary { background:var(--clay); color:var(--paper); box-shadow:0 8px 20px -8px oklch(0.605 0.135 42 / 0.55); }
.btn--primary:hover { background:var(--clay-deep); box-shadow:0 12px 26px -8px oklch(0.605 0.135 42 / 0.6); }
.btn--ghost { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn--ghost:hover { border-color:var(--ink); background:var(--surface); }
.btn--on-dark { background:var(--paper); color:var(--ink); }
.btn--on-dark:hover { background:var(--clay); color:var(--paper); }
.btn--ghost-dark { background:transparent; color:var(--on-dark); border-color:var(--hairline-dark); }
.btn--ghost-dark:hover { border-color:var(--on-dark); background:oklch(1 0 0 / 0.06); }
.btn--lg { padding:1.1rem 2rem; font-size:1rem; }
.arrow-link { display:inline-flex; align-items:center; gap:0.55rem; font-weight:600; font-size:0.95rem; color:var(--clay); }
.arrow-link i { transition:transform 0.3s var(--ease-out); }
.arrow-link:hover i { transform:translateX(5px); }

/* ---------- header ---------- */
.site-header { position:fixed; inset:0 0 auto 0; z-index:50; background:oklch(0.988 0.006 75 / 0.86); backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid transparent; transition:transform 0.4s var(--ease-out), border-color 0.3s var(--ease), background-color 0.3s var(--ease); }
.site-header.is-scrolled { border-bottom-color:var(--line); background:oklch(0.988 0.006 75 / 0.95); }
.site-header.is-hidden { transform:translateY(-100%); }
.header-inner { max-width:var(--container-wide); margin-inline:auto; padding:0.85rem var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.brand { display:inline-flex; align-items:center; gap:0.7rem; color:var(--ink); }
.brand-mark { width:38px; height:38px; display:grid; place-items:center; color:var(--clay); flex-shrink:0; }
.brand-mark .brick { width:34px; }
.brand-name { font-family:var(--font-display); font-weight:600; font-size:1.32rem; letter-spacing:-0.01em; line-height:1; color:var(--ink); }
.brand-name .light { color:var(--clay); }
.brand-sub { display:block; font-family:var(--font-body); font-size:0.58rem; font-weight:600; letter-spacing:0.22em; text-transform:uppercase; color:var(--muted); margin-top:3px; }
.brand-logo { height:clamp(126px, 14vw, 156px); width:auto; display:block; }
.footer-brand .brand-logo { height:180px; filter:brightness(0) invert(1); }
@media (max-width:768px){ .brand-logo { height:120px; } .footer-brand .brand-logo { height:150px; } }
.nav { display:flex; align-items:center; gap:0.4rem; }
.nav-link { position:relative; padding:0.5rem 0.9rem; font-weight:500; font-size:0.97rem; color:var(--ink-soft); border-radius:var(--r-sm); transition:color 0.2s var(--ease); }
.nav-link:hover, .nav-link[aria-current="page"] { color:var(--ink); }
.nav-link[aria-current="page"]::after { content:""; position:absolute; left:0.9rem; right:0.9rem; bottom:0.15rem; height:2px; background:var(--clay); border-radius:2px; }
.nav-dd { position:relative; }
.nav-dd-trigger { display:inline-flex; align-items:center; gap:0.4rem; background:none; border:0; color:var(--ink-soft); padding:0.5rem 0.9rem; font-weight:500; font-size:0.97rem; }
.nav-dd-trigger i { font-size:0.7em; transition:transform 0.3s var(--ease); }
.nav-dd:hover .nav-dd-trigger { color:var(--ink); }
.nav-dd:hover .nav-dd-trigger i { transform:rotate(180deg); }
.nav-dd-menu { position:absolute; top:calc(100% + 0.6rem); left:50%; transform:translateX(-50%) translateY(8px); width:340px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow-lg); padding:0.6rem; opacity:0; visibility:hidden; transition:opacity 0.25s var(--ease), transform 0.25s var(--ease-out), visibility 0.25s; }
.nav-dd:hover .nav-dd-menu, .nav-dd:focus-within .nav-dd-menu { opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dd-item { display:flex; gap:0.85rem; align-items:flex-start; padding:0.75rem 0.8rem; border-radius:var(--r-sm); transition:background-color 0.2s var(--ease); }
.dd-item:hover { background:var(--limestone); }
.dd-item i { color:var(--clay); width:1.4rem; text-align:center; margin-top:0.2rem; font-size:1rem; }
.dd-item .dd-t { font-weight:600; color:var(--ink); font-size:0.97rem; }
.dd-item .dd-d { font-size:0.83rem; color:var(--muted); line-height:1.45; }
.header-actions { display:flex; align-items:center; gap:1rem; }
.lang { display:inline-flex; align-items:center; font-size:0.82rem; font-weight:600; color:var(--muted); gap:0.1rem; }
.lang a { padding:0.3rem 0.45rem; border-radius:var(--r-sm); transition:color 0.2s; }
.lang a:hover { color:var(--ink); }
.lang a.active { color:var(--clay); }
.lang span { opacity:0.4; }
.menu-toggle { display:none; width:44px; height:44px; border:0; background:none; color:var(--ink); font-size:1.4rem; align-items:center; justify-content:center; }

/* ---------- mobile nav ---------- */
.mobile-nav { position:fixed; inset:0; z-index:60; background:var(--paper); transform:translateX(100%); transition:transform 0.45s var(--ease-out); display:flex; flex-direction:column; overflow-y:auto; visibility:hidden; }
.mobile-nav.is-open { transform:translateX(0); visibility:visible; }
.mobile-nav-head { display:flex; align-items:center; justify-content:space-between; padding:1rem var(--gutter); border-bottom:1px solid var(--line); }
.mobile-nav-body { padding:1.25rem var(--gutter); display:flex; flex-direction:column; }
.m-link { padding:0.95rem 0; font-family:var(--font-display); font-size:1.45rem; font-weight:460; color:var(--ink); border-bottom:1px solid var(--line); }
.m-group-label { padding:1.1rem 0 0.4rem; font-size:0.76rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--clay); }
.m-sub { padding:0.6rem 0; font-size:1.05rem; color:var(--ink-soft); display:flex; gap:0.7rem; align-items:center; }
.m-sub i { color:var(--clay); width:1.3rem; text-align:center; }
.mobile-nav-foot { margin-top:auto; padding:1.5rem var(--gutter) 2.5rem; }
.m-lang { display:flex; gap:0.75rem; margin-bottom:1.25rem; }
.m-lang a { flex:1; text-align:center; padding:0.85rem; border:1px solid var(--line); border-radius:var(--r); font-weight:600; }
.m-lang a.active { background:var(--clay); color:var(--paper); border-color:var(--clay); }

/* ---------- footer ---------- */
.site-footer { background:var(--espresso); color:var(--on-dark-soft); padding-block:clamp(3.5rem,7vw,5.5rem) 2rem; }
.footer-grid { display:grid; grid-template-columns:1.5fr 1fr 1fr 1.3fr; gap:clamp(2rem,5vw,3.5rem); padding-bottom:3rem; border-bottom:1px solid var(--hairline-dark); }
.footer-brand .brand-name, .footer-brand .brand-name .light { color:var(--on-dark); }
.footer-brand .brand-mark { color:var(--clay); }
.footer-brand p { color:var(--on-dark-soft); margin-top:1.1rem; font-size:0.95rem; max-width:30ch; }
.footer-col h4 { font-family:var(--font-body); font-size:0.78rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:oklch(0.82 0.09 55); margin-bottom:1.2rem; }
.footer-col ul { display:flex; flex-direction:column; gap:0.7rem; }
.footer-col a, .footer-contact a { color:var(--on-dark-soft); transition:color 0.2s var(--ease); }
.footer-col a:hover, .footer-contact a:hover { color:var(--on-dark); }
.footer-contact li { display:flex; gap:0.7rem; align-items:flex-start; margin-bottom:0.7rem; font-size:0.95rem; }
.footer-contact i { color:var(--clay); margin-top:0.25rem; width:1.1rem; }
.footer-social { display:flex; gap:0.6rem; margin-top:1.4rem; }
.footer-social a { width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--hairline-dark); border-radius:var(--r-pill); color:var(--on-dark-soft); transition:all 0.25s var(--ease); }
.footer-social a:hover { background:var(--clay); border-color:var(--clay); color:var(--paper); transform:translateY(-2px); }
.footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding-top:2rem; font-size:0.85rem; color:var(--muted); }
.footer-bottom a { color:var(--muted); }
.footer-bottom a:hover { color:var(--on-dark-soft); }

/* ---------- hero ---------- */
.hero { padding-top:clamp(7rem,12vw,9.5rem); padding-bottom:var(--section-y); overflow:clip; }
.hero-grid { display:grid; grid-template-columns:1.05fr 0.95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.hero-copy { max-width:38rem; }
.hero h1 { margin:1.1rem 0 0; }
.hero .accent { color:var(--clay); font-style:italic; }
.hero-sub { margin-top:1.5rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:0.9rem; margin-top:2rem; }
.hero-figure { position:relative; }
.hero-figure .frame { position:relative; border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--shadow-lg); aspect-ratio:4/5; background:var(--surface); }
.hero-figure img { width:100%; height:100%; object-fit:cover; }
.hero-tag { position:absolute; left:-1.2rem; bottom:2rem; background:var(--paper); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:0.9rem 1.2rem; display:flex; align-items:center; gap:0.8rem; max-width:17rem; }
.hero-tag .ic { width:40px; height:40px; border-radius:var(--r-sm); background:var(--clay-tint); color:var(--clay-deep); display:grid; place-items:center; font-size:1.1rem; flex-shrink:0; }
.hero-tag strong { display:block; font-size:0.95rem; color:var(--ink); }
.hero-tag span { font-size:0.8rem; color:var(--muted); }

/* ---------- trust strip ---------- */
.trust { border-block:1px solid var(--line); background:var(--limestone); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-item { padding:clamp(1.5rem,3vw,2.4rem) 1.5rem; text-align:center; border-left:1px solid var(--line); }
.trust-item:first-child { border-left:0; }
.trust-item .n { font-family:var(--font-display); font-size:clamp(1.6rem,3vw,2.2rem); font-weight:500; color:var(--clay); line-height:1; }
.trust-item .l { margin-top:0.5rem; font-size:0.9rem; color:var(--ink-soft); }

/* ---------- solutions ---------- */
.solutions-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1rem,2.2vw,1.6rem); }
.sol { position:relative; display:flex; flex-direction:column; justify-content:flex-end; min-height:24rem; padding:1.8rem; border-radius:var(--r-lg); overflow:hidden; color:var(--on-dark); isolation:isolate; }
.sol--feature { grid-column:span 2; min-height:22rem; }
.sol img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; transition:transform 0.7s var(--ease-out); }
.sol::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to top, oklch(0.22 0.02 55 / 0.86) 0%, oklch(0.22 0.02 55 / 0.36) 45%, oklch(0.22 0.02 55 / 0.10) 100%); }
.sol:hover img { transform:scale(1.05); }
.sol .eyebrow { color:oklch(0.86 0.08 60); margin-bottom:0.6rem; }
.sol h3 { color:#fff; font-size:clamp(1.4rem,2.2vw,1.85rem); }
.sol p { color:oklch(0.93 0.01 75); font-size:0.96rem; margin-top:0.5rem; max-width:44ch; }
.sol .arrow-link { color:#fff; margin-top:1.1rem; }
.sol .arrow-link i { color:oklch(0.86 0.08 60); }
.sol--feature .sol-inner { max-width:34rem; }

/* ---------- values ---------- */
.values { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.5rem,3.5vw,3rem) clamp(2rem,5vw,4rem); }
.value { display:flex; gap:1.2rem; align-items:flex-start; }
.value .ic { flex-shrink:0; width:52px; height:52px; border-radius:var(--r); background:var(--clay-tint); color:var(--clay-deep); display:grid; place-items:center; font-size:1.35rem; }
.value h3 { font-size:1.2rem; margin-bottom:0.4rem; font-family:var(--font-body); font-weight:700; letter-spacing:-0.005em; }
.value p { color:var(--ink-soft); font-size:0.97rem; }

/* ---------- process ---------- */
.process { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.5rem,4vw,3rem); counter-reset:step; }
.step { position:relative; }
.step::before { counter-increment:step; content:counter(step,decimal-leading-zero); font-family:var(--font-display); font-size:2.6rem; font-weight:400; color:var(--clay); display:block; line-height:1; margin-bottom:1.1rem; }
.step::after { content:""; position:absolute; top:1.3rem; left:3.4rem; right:-1.5rem; height:1px; background:var(--line-strong); }
.step:last-child::after { display:none; }
.step h3 { font-size:1.25rem; font-family:var(--font-body); font-weight:700; margin-bottom:0.5rem; }
.step p { color:var(--ink-soft); font-size:0.97rem; }

/* ---------- projects teaser ---------- */
.proj-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(0.85rem,1.6vw,1.2rem); }
.proj { position:relative; border-radius:var(--r); overflow:hidden; aspect-ratio:4/3; background:var(--surface); display:block; }
.proj img { width:100%; height:100%; object-fit:cover; transition:transform 0.6s var(--ease-out); }
.proj:hover img { transform:scale(1.06); }
.proj figcaption { position:absolute; inset:auto 0 0 0; padding:1.4rem 1.1rem 1rem; background:linear-gradient(to top, oklch(0.22 0.02 55 / 0.82), transparent); color:#fff; font-weight:600; font-size:0.95rem; opacity:0; transform:translateY(8px); transition:opacity 0.3s var(--ease), transform 0.3s var(--ease-out); }
.proj:hover figcaption { opacity:1; transform:translateY(0); }

/* ---------- cta band ---------- */
.cta-band { background:var(--espresso); color:var(--on-dark); text-align:center; }
.cta-band .h2 { color:#fff; }
.cta-band p { color:var(--on-dark-soft); margin:1rem auto 0; }
.cta-actions { display:flex; flex-wrap:wrap; gap:0.9rem; justify-content:center; margin-top:2.2rem; }

/* ---------- header call button (mobile) ---------- */
.header-call { display:none; width:42px; height:42px; place-items:center; border-radius:var(--r-pill); background:var(--clay); color:var(--paper); font-size:1rem; box-shadow:0 6px 16px -6px oklch(0.605 0.135 42 / 0.6); transition:background-color 0.2s var(--ease), transform 0.2s var(--ease-out); }
.header-call:active { transform:scale(0.94); background:var(--clay-deep); }

/* ---------- red catalog button ---------- */
.btn--catalog { background:var(--catalog-red); color:#fff; box-shadow:0 8px 20px -8px oklch(0.55 0.17 25 / 0.6); }
.btn--catalog:hover { background:var(--catalog-red-deep); color:#fff; box-shadow:0 12px 26px -8px oklch(0.55 0.17 25 / 0.65); }

/* ---------- floating action buttons (WhatsApp + back-to-top) ---------- */
.fab-wa { position:fixed; right:clamp(0.9rem,3vw,1.4rem); bottom:clamp(0.9rem,3vw,1.4rem); z-index:45; display:grid; place-items:center; width:56px; height:56px; border-radius:var(--r-pill); background:#25D366; color:#fff; font-size:1.7rem; box-shadow:0 12px 26px -8px rgb(37 211 102 / 0.6), 0 2px 8px rgb(40 30 22 / 0.18); transition:transform 0.2s var(--ease-out); }
.fab-wa:hover { transform:translateY(-2px) scale(1.04); }
.fab-top { position:fixed; right:clamp(0.9rem,3vw,1.4rem); bottom:calc(clamp(0.9rem,3vw,1.4rem) + 66px); z-index:45; display:grid; place-items:center; width:44px; height:44px; border:1px solid var(--line); border-radius:var(--r-pill); background:oklch(0.988 0.006 75 / 0.95); color:var(--ink); box-shadow:var(--shadow); backdrop-filter:blur(8px); cursor:pointer; opacity:0; visibility:hidden; transform:translateY(10px); transition:opacity 0.3s var(--ease), transform 0.3s var(--ease-out), visibility 0.3s, background-color 0.2s var(--ease); }
.fab-top.is-visible { opacity:1; visibility:visible; transform:none; }
.fab-top:hover { background:var(--surface); }

/* ---------- newsletter band ---------- */
.newsletter { background:var(--clay-tint); border-top:1px solid var(--line); }
.newsletter-inner { display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.newsletter h2 { font-size:clamp(1.6rem,2.6vw,2.2rem); }
.newsletter p { color:var(--ink-soft); margin-top:0.6rem; }
.newsletter-form { display:flex; gap:0.6rem; flex-wrap:wrap; }
.newsletter-form input[type=email] { flex:1; min-width:0; padding:0.95rem 1.2rem; border:1.5px solid var(--line-strong); border-radius:var(--r-pill); background:var(--paper); color:var(--ink); font:inherit; font-size:0.98rem; }
.newsletter-form input[type=email]:focus-visible { outline:2px solid var(--clay); outline-offset:1px; border-color:var(--clay); }
.newsletter-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.newsletter-msg { margin-top:0.8rem; font-size:0.9rem; font-weight:600; min-height:1.2em; }
.newsletter-msg.ok { color:var(--clay-deep); }
.newsletter-msg.err { color:oklch(0.52 0.18 25); }
@media (max-width:768px) {
  .header-call { display:grid; }
  .newsletter-inner { grid-template-columns:1fr; }
}

/* ---------- reveal (progressive enhancement: hidden only when JS is on) ---------- */
.js .reveal { opacity:0; transform:translateY(18px); transition:opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
.js .reveal.is-in { opacity:1; transform:none; }
.js .reveal[data-delay="1"] { transition-delay:0.08s; }
.js .reveal[data-delay="2"] { transition-delay:0.16s; }
.js .reveal[data-delay="3"] { transition-delay:0.24s; }

/* ---------- responsive ---------- */
@media (max-width:1024px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-figure { max-width:30rem; margin-inline:auto; order:-1; }
  .hero-figure .frame { aspect-ratio:16/11; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:768px) {
  .nav, .header-actions .lang, .header-actions .btn { display:none; }
  .menu-toggle { display:inline-flex; }
  .header-actions { gap:0.5rem; }
  .trust-grid { grid-template-columns:repeat(2,1fr); }
  .trust-item:nth-child(1), .trust-item:nth-child(2) { border-bottom:1px solid var(--line); }
  .trust-item:nth-child(odd) { border-left:0; }
  .solutions-grid { grid-template-columns:1fr; }
  .sol--feature { grid-column:span 1; }
  .values { grid-template-columns:1fr; }
  .process { grid-template-columns:1fr; gap:2rem; }
  .step::after { display:none; }
  .proj-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr; gap:2.5rem; }
}
@media (max-width:460px) { .proj-grid { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; }
}