/* ASSETA LTD: Terrace variant. Generated by _build/build.js. Do not edit by hand. */
/* ===== ASSETA shared structure. Variant themes override tokens and look. ===== */
@layer reset, base, layout, components, theme, utilities;

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}

@layer reset {
  :where(*, *::before, *::after) { box-sizing: border-box; }
  :where(body, h1, h2, h3, p, figure, blockquote, dl, dd, ul, ol, fieldset) { margin: 0; }
  :where(ul, ol)[class] { list-style: none; padding: 0; }
  :where(fieldset) { border: 0; padding: 0; min-inline-size: 0; }
  :where(img, svg) { display: block; max-inline-size: 100%; }
  :where(img) { block-size: auto; }
  :where(input, textarea, button, select) { font: inherit; color: inherit; }
  :where(a) { color: inherit; }
}

@layer base {
  :root {
    --wrap: 76rem;
    --gutter: clamp(1rem, 0.4rem + 2.6vw, 2.25rem);
    --section: clamp(4.5rem, 3rem + 6vw, 8.5rem);
    --radius: 0;
    --display-weight: 500;
    --display-tracking: -0.02em;
    --display-leading: 1.04;
    --display-transform: none;
    --header-h: 4.75rem;
    accent-color: var(--accent);
  }
  html { scroll-behavior: smooth; scroll-padding-block-start: calc(var(--header-h) + 1.5rem); -webkit-text-size-adjust: 100%; }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  body { background: var(--bg); color: var(--text); font: 400 1.0625rem/1.68 var(--font-body); -webkit-font-smoothing: antialiased; overflow-x: clip; }
  a { text-decoration: none; }
  ::selection { background: var(--accent); color: var(--on-accent); }
  :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
  h1, h2, h3 { font-family: var(--font-display); font-weight: var(--display-weight); letter-spacing: var(--display-tracking); line-height: var(--display-leading); text-transform: var(--display-transform); text-wrap: balance; }
  p, li { text-wrap: pretty; }
  strong { font-weight: 600; color: var(--text); }
  .prose a, .form-note a, .block-body a:not(.btn) { color: var(--accent); text-decoration: underline; text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
}

@layer layout {
  .wrap { inline-size: min(100% - 2 * var(--gutter), var(--wrap)); margin-inline: auto; }
  .skip { position: absolute; inset-inline-start: 1rem; inset-block-start: -4rem; z-index: 100; padding: .75rem 1rem; background: var(--accent); color: var(--on-accent); }
  .skip:focus { inset-block-start: 1rem; }

  /* header */
  .site-header { position: sticky; inset-block-start: 0; z-index: 50; background: var(--header-bg, var(--bg)); transition: box-shadow .3s, background .3s; view-transition-name: site-header; }
  .nav { display: flex; align-items: center; gap: 2rem; min-block-size: var(--header-h); }
  .brand { display: inline-flex; align-items: center; margin-inline-end: auto; }
  .brand svg { block-size: 1.6rem; inline-size: auto; }
  .nav-links { display: flex; gap: clamp(1rem, 2vw, 2rem); font-size: .92rem; }
  .nav-links a { position: relative; padding-block: .5rem; white-space: nowrap; color: var(--muted); transition: color .2s; }
  .nav-links a:is(:hover, [aria-current]) { color: var(--text); }
  .menu-btn { display: none; }
  #menu { display: none; }
  /* 768–1023px (tablets, narrow laptop windows); full desktop header from 1024px: keep the menu, drop the header CTA */
  @media (max-width: 63.99rem) { .nav .nav-cta { display: none; } .nav-links { gap: clamp(.9rem, 1.6vw, 1.5rem); } }
  @media (max-width: 48rem) {
    .nav .nav-links { display: none; }
    .menu-btn { display: inline-grid; place-content: center; gap: 6px; inline-size: 2.9rem; block-size: 2.9rem; padding: 0; background: transparent; border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer; }
    .menu-btn span { display: block; inline-size: 1.15rem; block-size: 1.5px; background: currentColor; }
    #menu:popover-open {
      display: flex; flex-direction: column; gap: .25rem; position: fixed; inset: 0; margin: 0;
      inline-size: 100%; block-size: 100dvh; max-inline-size: none; max-block-size: none;
      padding: 6rem var(--gutter) 2rem; border: 0; background: var(--bg); color: var(--text);
      font-family: var(--font-display); font-size: clamp(1.8rem, 1.4rem + 3vw, 2.6rem); line-height: 1.2;
      opacity: 1; translate: 0 0;
      transition: opacity .3s, translate .3s, display .3s allow-discrete, overlay .3s allow-discrete;
      @starting-style { opacity: 0; translate: 0 -1rem; }
    }
    #menu > a:not(.btn) { padding-block: .55rem; border-block-end: 1px solid var(--line); }
    #menu > a[aria-current] { color: var(--accent); }
    #menu .btn { margin-block-start: 2rem; align-self: start; font-family: var(--font-body); }
    #menu .menu-close { position: absolute; inset-block-start: 1.1rem; inset-inline-end: var(--gutter); min-block-size: 2.9rem; padding-inline: 1rem; font: 500 .9rem/1 var(--font-body); background: transparent; border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer; }
  }

  /* hero for inner pages */
  .page-hero { position: relative; overflow: hidden; padding-block: clamp(4rem, 3rem + 5vw, 7.5rem) clamp(3rem, 2rem + 4vw, 5.5rem); }
  .page-hero-in { position: relative; }
  .page-hero h1 { font-size: clamp(2.6rem, 1.4rem + 5vw, 5.4rem); max-inline-size: 18ch; margin-block-start: 1.25rem; }
  .page-lead { display: grid; gap: 1rem; max-inline-size: 44rem; margin-block-start: 2rem; font-size: 1.18rem; color: var(--muted); }

  /* blocks */
  .block { padding-block: var(--section); }
  .block-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); align-items: start; }
  .block-head h2 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.5rem); margin-block-start: 1rem; }
  .block-head.wide { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(2rem, 6vw, 6rem); margin-block-end: clamp(2.5rem, 5vw, 4rem); }
  .block-head.wide .eyebrow { grid-column: 1 / -1; }
  .block-intro { display: grid; gap: 1rem; color: var(--muted); align-self: end; }
  .block-body { display: grid; gap: 1.15rem; color: var(--muted); }
  .block-body .lead, .company-body .lead { font-size: 1.22rem; line-height: 1.5; color: var(--text); }
  @media (min-width: 48.01rem) { .block-head { position: sticky; inset-block-start: calc(var(--header-h) + 2rem); } }
  @media (max-width: 48rem) { .block-grid, .block-head.wide { grid-template-columns: 1fr; } .block-head.wide { row-gap: 1.25rem; } }

  /* principles */
  .principles { display: grid; margin-block-start: 1.5rem; border-block-start: 1px solid var(--line); }
  .principles li { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1rem; padding-block: 1.5rem; border-block-end: 1px solid var(--line); }
  .principles .idx { grid-row: span 2; }
  .principles h3 { font-size: 1.35rem; color: var(--text); margin-block-end: .35rem; }

  .idx { font: 500 .75rem/1.9 var(--font-label); letter-spacing: .12em; color: var(--accent); font-variant-numeric: tabular-nums; }

  /* lists */
  .ticks { display: grid; gap: .65rem; }
  .ticks li { position: relative; padding-inline-start: 1.6rem; color: var(--text); }
  .ticks li::before { content: ""; position: absolute; inset-inline-start: 0; inset-block-start: .72em; inline-size: .8rem; block-size: 1.5px; background: var(--accent); }
  .ticks-2 { grid-template-columns: 1fr 1fr; column-gap: 2rem; }
  @media (max-width: 40rem) { .ticks-2 { grid-template-columns: 1fr; } }
  .chips { display: flex; flex-wrap: wrap; gap: .5rem; }
  .chips li { padding: .5rem .95rem; border: 1px solid var(--line); border-radius: var(--chip-radius, 999px); color: var(--text); font-size: .92rem; }
  .after { color: var(--muted); }
  .closing { font-family: var(--font-display); font-size: clamp(1.35rem, 1.1rem + 1vw, 1.8rem); line-height: 1.25; color: var(--text); }

  /* cards */
  .involve-lead { max-inline-size: 40rem; margin-block-end: 2.5rem; font-size: 1.2rem; color: var(--text); }
  .cards { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
  .cards-3 { grid-template-columns: repeat(3, 1fr); }
  .cards-2 { grid-template-columns: repeat(2, 1fr); }
  .card { display: grid; align-content: start; gap: .75rem; padding: clamp(1.5rem, 3vw, 2.25rem); background: var(--surface); }
  .card h3 { font-size: 1.4rem; margin-block-start: 1.5rem; }
  .card p { color: var(--muted); font-size: .98rem; }
  @media (max-width: 62rem) { .cards-3 { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 40rem) { .cards-3, .cards-2 { grid-template-columns: 1fr; } }

  /* portfolio */
  .companies { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); }
  .company { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 6vw, 6rem); padding: clamp(1.75rem, 4vw, 3.5rem); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); }
  .company-head { display: grid; align-content: start; gap: 1.25rem; }
  .company-head h2 { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.2rem); }
  .company-body { display: grid; gap: 1.1rem; color: var(--muted); }
  .facts { display: grid; border-block-start: 1px solid var(--line); }
  .facts div { display: grid; grid-template-columns: 6.5rem 1fr; gap: 1rem; padding-block: .7rem; border-block-end: 1px solid var(--line); font-size: .92rem; }
  .facts dt { font: 500 .72rem/1.9 var(--font-label); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
  @media (max-width: 48rem) { .company { grid-template-columns: 1fr; } }

  /* partner */
  .work-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
  .work-grid h2 { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.4rem); margin-block: 1rem 1.5rem; }
  .work-grid p:not(.eyebrow) { color: var(--muted); }
  .work-grid p + p { margin-block-start: 1rem; }
  .work-photo { overflow: hidden; border-radius: var(--radius); }
  .work-photo img { inline-size: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: 45% 50%; }
  @media (max-width: 48rem) { .work-grid { grid-template-columns: 1fr; } }

  /* form */
  .form-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2rem, 6vw, 6rem); }
  @media (max-width: 48rem) { .form-grid { grid-template-columns: 1fr; } }
  .enquiry { display: grid; gap: 1.75rem; }
  .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem 2rem; }
  @media (max-width: 40rem) { .grid-2 { grid-template-columns: 1fr; } }
  .field { display: grid; gap: .45rem; }
  .field > span, .choice legend { font: 500 .78rem/1.3 var(--font-label); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
  .field :is(input, textarea) { inline-size: 100%; padding: .85rem 1rem; background: var(--field-bg, transparent); border: 1px solid var(--line); border-radius: var(--radius); color: var(--text); font-size: 1rem; transition: border-color .2s, box-shadow .2s; }
  .field :is(input, textarea):focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 20%, transparent); }
  .field :is(input, textarea):user-invalid, .tried .field :is(input, textarea):invalid { border-color: var(--danger, #c2410c); }
  .field textarea { resize: vertical; min-block-size: 9rem; }
  .choice legend { margin-block-end: .8rem; }
  .choice-row { display: flex; flex-wrap: wrap; gap: .5rem; }
  .choice-row label { position: relative; cursor: pointer; }
  .choice-row input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
  .choice-row span { display: inline-flex; min-block-size: 2.75rem; align-items: center; padding: .55rem 1rem; border: 1px solid var(--line); border-radius: var(--chip-radius, 999px); font-size: .93rem; transition: background .2s, color .2s, border-color .2s; }
  .choice-row label:hover span { border-color: var(--text); }
  .choice-row input:checked + span { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
  .choice-row input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
  .form-foot { display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
  .form-note { font-size: .88rem; color: var(--muted); }
  .form-status:not(:empty) { padding: .9rem 1.1rem; border-inline-start: 3px solid var(--accent); background: var(--surface); color: var(--text); }

  /* contact */
  .contact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
  .contact-card { display: grid; align-content: start; gap: .75rem; min-block-size: 14rem; padding: clamp(1.5rem, 3vw, 2.5rem); background: var(--surface); }
  .contact-big { font-family: var(--font-display); font-size: clamp(1.35rem, 1.1rem + 1vw, 1.9rem); line-height: 1.2; color: var(--text); overflow-wrap: anywhere; }
  .contact-big a:hover { color: var(--accent); }
  .contact-card p:last-child:not(.contact-big) { color: var(--muted); }
  @media (max-width: 48rem) { .contact-grid { grid-template-columns: 1fr; } .contact-card { min-block-size: 0; } }

  /* legal */
  .legal-grid { display: grid; grid-template-columns: 14rem 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: start; }
  .legal-nav { position: sticky; inset-block-start: calc(var(--header-h) + 2rem); display: grid; gap: .25rem; }
  .legal-nav a { padding: .6rem 0; border-block-end: 1px solid var(--line); color: var(--muted); }
  .legal-nav a[aria-current] { color: var(--text); font-weight: 600; }
  .prose { display: grid; gap: 2.25rem; max-inline-size: 46rem; }
  .prose section { display: grid; gap: 1rem; }
  .prose h2 { font-size: 1.45rem; }
  .prose p { color: var(--muted); overflow-wrap: anywhere; }
  .prose section:first-child p:first-child { font-size: 1.15rem; color: var(--text); }
  @media (max-width: 48rem) { .legal-grid { grid-template-columns: 1fr; } .legal-nav { position: static; display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; } .legal-nav a { border: 0; padding: 0; } }

  /* 404 */
  .nf { display: grid; justify-items: start; gap: 1.25rem; padding-block: var(--section); min-block-size: 60dvh; align-content: center; }
  .nf h1 { font-size: clamp(2.6rem, 1.5rem + 5vw, 5rem); }

  /* buttons */
  .cta-row { display: flex; flex-wrap: wrap; gap: .75rem; }
  .btn { display: inline-flex; align-items: center; justify-content: center; gap: .65rem; min-block-size: 3rem; padding: .85rem 1.5rem; border: 1px solid transparent; border-radius: var(--btn-radius, var(--radius)); font: 500 .95rem/1 var(--font-body); cursor: pointer; white-space: nowrap; transition: background .2s, color .2s, border-color .2s; }
  .btn-primary { background: var(--accent); color: var(--on-accent); }
  .btn-primary:hover { background: var(--accent-hover, var(--text)); color: var(--on-accent-hover, var(--bg)); }
  .btn-secondary { border-color: currentColor; color: var(--text); }
  .btn-secondary:hover { background: var(--text); color: var(--bg); border-color: var(--text); }
  .btn .arr { transition: translate .2s; }
  .btn:hover .arr { translate: 3px 0; }
  .nav-cta { padding-inline: 1.2rem; min-block-size: 2.75rem; font-size: .9rem; }

  /* footer */
  .site-footer { padding-block: clamp(3.5rem, 3rem + 3vw, 5rem) 2rem; }
  .foot-top { display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap; padding-block-end: 2.5rem; }
  .foot-id p { margin-block-start: 1rem; color: var(--foot-muted, var(--muted)); font-size: .95rem; }
  .foot-nav, .foot-legal { display: flex; flex-wrap: wrap; gap: .5rem 1.75rem; }
  .foot-nav a, .foot-legal a { color: var(--foot-muted, var(--muted)); }
  .foot-nav a:hover, .foot-legal a:hover { color: var(--foot-text, var(--text)); }
  .foot-bottom { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; padding-block-start: 1.5rem; border-block-start: 1px solid var(--foot-line, var(--line)); font-size: .85rem; color: var(--foot-muted, var(--muted)); }
}

@layer utilities {
  .eyebrow { display: inline-flex; align-items: center; gap: .75rem; font: 500 .78rem/1.2 var(--font-label); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
  .reveal { opacity: 0; translate: 0 1.5rem; transition: opacity .9s cubic-bezier(.2,.8,.2,1), translate .9s cubic-bezier(.2,.8,.2,1); }
  .reveal.on, .no-js .reveal { opacity: 1; translate: 0 0; }
  .rise { opacity: 0; translate: 0 1.25rem; animation: rise .9s cubic-bezier(.2,.8,.2,1) forwards; }
  .d1 { animation-delay: .08s; } .d2 { animation-delay: .2s; } .d3 { animation-delay: .32s; } .d4 { animation-delay: .46s; }
  @keyframes rise { to { opacity: 1; translate: 0 0; } }
  @media (prefers-reduced-motion: reduce) { .reveal, .rise { opacity: 1; translate: 0 0; transition: none; animation: none; } }
  @media (forced-colors: active) { .btn, .card, .company, .contact-card { border: 1px solid CanvasText; } }
}


@layer theme {
  :root {
    --bg:#efe9df; --surface:#f8f4ed; --text:#241f1c; --muted:#685f57; --line:#d8cebf;
    --accent:#7b2433; --on-accent:#fff; --accent-hover:#5c1a26; --on-accent-hover:#fff;
    --sea:#1f4e66; --sky:#f3d9b5;
    --font-display:"Familjen Grotesk", system-ui, sans-serif; --font-body:"Familjen Grotesk", system-ui, sans-serif; --font-label:"Familjen Grotesk", system-ui, sans-serif;
    --display-weight:600; --display-tracking:-.03em; --display-leading:1.02;
    --radius:6px; --btn-radius:999px;
    --header-bg: color-mix(in oklab, var(--bg) 90%, transparent);
  }
  h1 em, h2 em { font-family:"Instrument Serif", serif; font-style:italic; font-weight:400; letter-spacing:-.01em; color:var(--accent); }
  .site-header { backdrop-filter:blur(10px); }
  .site-header.scrolled { box-shadow:0 1px 0 var(--line); }
  .brand svg { block-size:1.7rem; }
  .nav-links a[aria-current] { color:var(--accent); }
  .eyebrow { letter-spacing:.12em; }

  .t-hero { padding-block-end:var(--section); }
  .horizon { position:relative; overflow:hidden; block-size:clamp(20rem, 52vh, 34rem); border-radius:0 0 var(--radius) var(--radius); }
  .sky { position:absolute; inset:0 0 38% 0; background:linear-gradient(180deg, #e9dfd0 0%, var(--sky) 70%, #f6c99a 100%); }
  .sun { position:absolute; inset-inline-start:68%; inset-block-end:38%; inline-size:clamp(7rem,14vw,12rem); aspect-ratio:1; border-radius:50%; translate:-50% 50%; background:radial-gradient(circle at 50% 45%, #fff3df, #f2b880 60%, #e79a64); box-shadow:0 0 6rem 2rem rgba(242,184,128,.45); }
  .sea { position:absolute; inset:62% 0 0 0; background:linear-gradient(180deg, #2f6a84 0%, var(--sea) 55%, #163a4d 100%); }
  .sea i { position:absolute; inset-inline-start:68%; translate:-50% 0; block-size:2px; border-radius:2px; background:linear-gradient(90deg, transparent, rgba(255,226,190,.85), transparent); }
  .sea i:nth-child(1) { inset-block-start:12%; inline-size:16rem; }
  .sea i:nth-child(2) { inset-block-start:30%; inline-size:11rem; opacity:.7; }
  .sea i:nth-child(3) { inset-block-start:52%; inline-size:7rem; opacity:.5; }
  @media (prefers-reduced-motion:no-preference) { .sea i { animation:shimmer 5s ease-in-out infinite alternate; } .sea i:nth-child(2) { animation-delay:-1.5s; } .sea i:nth-child(3) { animation-delay:-3s; } }
  @keyframes shimmer { from { scale:.75 1; opacity:.35; } to { scale:1.1 1; opacity:1; } }
  .t-photo { position:relative; overflow:hidden; block-size:clamp(20rem, 56vh, 36rem); border-radius:0 0 var(--radius) var(--radius); }
  .t-photo :is(img, video) { display:block; inline-size:100%; block-size:100%; object-fit:cover; object-position:70% 60%; }
  @media (max-width:40rem) { .t-photo :is(img, video) { object-position:95% 60%; } }
  .t-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(36,31,28,.25)); }
  .t-mini-photo { margin-block-start:2.5rem; overflow:hidden; border-radius:var(--radius); }
  .t-mini-photo img { inline-size:100%; aspect-ratio:4 / 3; object-fit:cover; }
  .t-hero-in { position:relative; margin-block-start:clamp(-12rem, -18vw, -7rem); }
  .t-card { display:inline-grid; gap:1.25rem; max-inline-size:min(100%, 52rem); padding:clamp(1.75rem,4vw,3.25rem); background:var(--accent); color:#fff; border-radius:var(--radius); }
  .t-card .eyebrow { color:#f3d9b5; }
  .t-card h1 { font-size:clamp(2.6rem,1.2rem + 5.4vw,5.75rem); line-height:.98; }
  .t-card h1 em { color:#f3d9b5; }
  .t-intro { display:grid; grid-template-columns:minmax(0,6fr) minmax(0,6fr); gap:clamp(2rem,5vw,5rem); margin-block-start:clamp(2.5rem,5vw,4rem); }
  .t-lead { font-size:clamp(1.3rem,1.05rem + 1vw,1.75rem); line-height:1.4; letter-spacing:-.01em; }
  .t-rest { display:grid; gap:1.1rem; color:var(--muted); }
  .t-rest .cta-row { margin-block-start:.75rem; }

  .block-head h2 { font-size:clamp(2.1rem,1.3rem + 3vw,3.9rem); }
  .b-about { background:var(--surface); }
  .b-about .block-body p:last-child strong, .closing { font-family:"Instrument Serif", serif; font-style:italic; font-weight:400; font-size:clamp(1.6rem,1.2rem + 1.4vw,2.3rem); color:var(--accent); }
  .principles .idx { color:var(--accent); }
  .b-cyprus { background:var(--sea); color:#f4efe6; --text:#f4efe6; --muted:#bfd0d8; --line:#3c6a80; --accent:#f3d9b5; }
  .mini-horizon { margin-block-start:2.5rem; }
  .mini-horizon .horizon { block-size:14rem; border-radius:var(--radius); }

  .page-hero { background:var(--accent); color:#fff; --text:#fff; --muted:#efd5d9; }
  .page-hero .eyebrow { color:#f3d9b5; }
  .page-hero .btn-secondary { color:#fff; border-color:rgba(255,255,255,.7); }
  .page-hero .btn-secondary:hover { background:#fff; color:var(--accent); border-color:#fff; }
  /* setting sun: a clear disc sinking behind the bottom edge, with light on the "water" */
  .hero-sun { position:absolute; inset-inline-end:clamp(1rem, 8vw, 8rem); inset-block-end:0; inline-size:clamp(11rem, 22vw, 19rem); aspect-ratio:1; pointer-events:none; }
  .hero-sun .disc { position:absolute; inset:0; translate:0 48%; border-radius:50%;
    background:radial-gradient(circle at 50% 40%, #fff1dc 0%, #f7cf9c 38%, #ee9f68 72%, #df7f52 100%);
    box-shadow:0 0 3rem 1rem rgba(247,190,130,.35), 0 0 9rem 4rem rgba(240,160,110,.22); }
  .hero-sun .glint { position:absolute; inset-inline:-30%; inset-block-end:0; block-size:3.25rem; display:grid; align-content:end; justify-items:center; gap:.55rem; padding-block-end:.6rem; }
  .hero-sun .glint i { display:block; block-size:2px; border-radius:2px; background:linear-gradient(90deg, transparent, rgba(255,228,195,.75), transparent); }
  .hero-sun .glint i:nth-child(1) { inline-size:60%; }
  .hero-sun .glint i:nth-child(2) { inline-size:42%; opacity:.75; }
  .hero-sun .glint i:nth-child(3) { inline-size:26%; opacity:.55; }
  @media (prefers-reduced-motion:no-preference) {
    .hero-sun .disc { animation:sunset 1.6s .2s cubic-bezier(.2,.8,.2,1) both; }
    .hero-sun .glint i { animation:shimmer 4.5s ease-in-out infinite alternate; }
    .hero-sun .glint i:nth-child(2) { animation-delay:-1.4s; } .hero-sun .glint i:nth-child(3) { animation-delay:-2.8s; }
  }
  @keyframes sunset { from { translate:0 25%; opacity:0; } to { translate:0 48%; opacity:1; } }
  .page-hero-in { z-index:1; }
  @media (max-width:40rem) { .page-hero { padding-block-end:6.5rem; } .hero-sun { inline-size:10rem; inset-inline-end:1.5rem; } }
  .card { background:var(--surface); }
  .card h3 { margin-block-start:1rem; }
  .company { background:var(--surface); }
  .mono-badge { display:grid; place-items:center; inline-size:4rem; aspect-ratio:1; border-radius:50%; background:var(--accent); color:#fff; font:italic 400 1.6rem/1 "Instrument Serif", serif; }
  .company-head h2 { color:var(--accent); }
  .chips li { background:var(--surface); }
  .b-bring { background:var(--surface); }
  .b-work .work-photo { border-radius:var(--radius); }
  .b-form { background:var(--surface); }
  .field :is(input, textarea) { background:#fff; }

  .site-footer { background:var(--accent); color:#fff; --foot-muted:#efd5d9; --foot-text:#fff; --foot-line:#94404d; }
  .site-footer .brand svg { color:#fff; --accent:#f3d9b5; --bg:#7b2433; }

  @media (max-width:48rem) { .t-intro { grid-template-columns:1fr; } }
}