/* core 0.1.0, skin icc-sunset */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/poppins/poppins-latin-400.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: "Poppins"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/poppins/poppins-latin-ext-400.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/poppins/poppins-latin-600.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: "Poppins"; font-style: normal; font-weight: 600; font-display: swap; src: url("/fonts/poppins/poppins-latin-ext-600.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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Poppins Fallback"; src: local("Arial"); size-adjust: 112%; ascent-override: 93%; descent-override: 31%; line-gap-override: 0%; }

/* AuraicPulse core tokens (WEBSITE-TEMPLATE-SPEC 10). Sections read only these.
   Skins override the values in skin.json; facts.brand colours override primary
   and accent when they pass the contrast check. Light first, then dark. */
:root {
  color-scheme: light dark;
  /* colour: light */
  --color-bg: oklch(0.99 0.004 90);
  --color-surface: oklch(0.965 0.006 90);
  --color-surface-2: oklch(0.93 0.008 90);
  --color-fg: oklch(0.22 0.012 250);
  --color-fg-muted: oklch(0.45 0.012 250);
  --color-line: oklch(0.88 0.01 250);
  --color-line-strong: oklch(0.56 0.012 250);
  --color-primary: oklch(0.45 0.11 250);
  --color-primary-fg: oklch(0.99 0 0);
  --color-accent: oklch(0.8 0.12 75);
  --color-accent-fg: oklch(0.22 0.03 60);
  --color-link: oklch(0.45 0.12 250);
  --color-focus: oklch(0.5 0.16 250);
  --color-success: oklch(0.5 0.12 150);
  --color-warning: oklch(0.75 0.14 80);
  --color-danger: oklch(0.52 0.18 28);
  --color-overlay: oklch(0.2 0.01 250 / 0.55);

  /* type */
  --font-display: Georgia, "Times New Roman", serif;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --text-base: 1.0625rem;
  --scale: 1.25;
  --measure: 68ch;
  --leading: 1.6;
  --leading-tight: 1.15;
  --weight-body: 400;
  --weight-strong: 650;
  --weight-display: 600;
  --tracking-display: -0.01em;
  --step--1: clamp(0.875rem, 0.84rem + 0.15vw, 0.9375rem);
  --step-0: clamp(1rem, 0.97rem + 0.2vw, var(--text-base));
  --step-1: clamp(1.15rem, 1.08rem + 0.35vw, 1.35rem);
  --step-2: clamp(1.35rem, 1.2rem + 0.7vw, 1.75rem);
  --step-3: clamp(1.6rem, 1.35rem + 1.2vw, 2.3rem);
  --step-4: clamp(1.9rem, 1.5rem + 2vw, 3.1rem);
  --step-5: clamp(2.1rem, 1.6rem + 2.8vw, 4rem);

  /* space */
  --space: 1rem;
  --density: 1;
  --space-1: calc(var(--space) * 0.25 * var(--density));
  --space-2: calc(var(--space) * 0.5 * var(--density));
  --space-3: calc(var(--space) * 0.75 * var(--density));
  --space-4: calc(var(--space) * 1 * var(--density));
  --space-5: calc(var(--space) * 1.5 * var(--density));
  --space-6: calc(var(--space) * 2 * var(--density));
  --space-7: calc(var(--space) * 3 * var(--density));
  --space-8: calc(var(--space) * 4.5 * var(--density));
  --section-pad: clamp(2.5rem, 1.5rem + 4vw, 6rem);
  --gutter: clamp(1rem, 0.6rem + 2vw, 2.5rem);
  --container: 74rem;
  --container-wide: 96rem;
  --tap: 2.75rem;

  /* shape */
  --radius: 0.75rem;
  --radius-sm: calc(var(--radius) * 0.5);
  --radius-lg: calc(var(--radius) * 1.6);
  --radius-pill: 999px;
  --border: 1px;
  --shadow: 0 1px 2px oklch(0 0 0 / 0.06), 0 8px 24px oklch(0 0 0 / 0.06);
  --shadow-lg: 0 2px 4px oklch(0 0 0 / 0.06), 0 18px 48px oklch(0 0 0 / 0.1);

  /* motion: --motion 0 turns everything off */
  --motion: 1;
  --dur-1: calc(160ms * var(--motion));
  --dur-2: calc(320ms * var(--motion));
  --dur-3: calc(640ms * var(--motion));
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --reveal-distance: calc(1rem * var(--motion));
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: oklch(0.17 0.01 250);
    --color-surface: oklch(0.21 0.012 250);
    --color-surface-2: oklch(0.26 0.014 250);
    --color-fg: oklch(0.95 0.005 90);
    --color-fg-muted: oklch(0.77 0.01 250);
    --color-line: oklch(0.33 0.012 250);
    --color-line-strong: oklch(0.62 0.012 250);
    --color-primary: oklch(0.78 0.1 250);
    --color-primary-fg: oklch(0.17 0.02 250);
    --color-accent: oklch(0.8 0.12 75);
    --color-accent-fg: oklch(0.2 0.03 60);
    --color-link: oklch(0.82 0.09 250);
    --color-focus: oklch(0.82 0.12 250);
    --color-success: oklch(0.75 0.12 150);
    --color-warning: oklch(0.8 0.13 80);
    --color-danger: oklch(0.72 0.15 28);
    --color-overlay: oklch(0 0 0 / 0.65);
    --shadow: 0 1px 2px oklch(0 0 0 / 0.4), 0 8px 24px oklch(0 0 0 / 0.35);
    --shadow-lg: 0 2px 4px oklch(0 0 0 / 0.4), 0 18px 48px oklch(0 0 0 / 0.45);
  }
}
:root[data-theme="dark"] {
  --color-bg: oklch(0.17 0.01 250);
  --color-surface: oklch(0.21 0.012 250);
  --color-surface-2: oklch(0.26 0.014 250);
  --color-fg: oklch(0.95 0.005 90);
  --color-fg-muted: oklch(0.77 0.01 250);
  --color-line: oklch(0.33 0.012 250);
  --color-line-strong: oklch(0.62 0.012 250);
  --color-primary: oklch(0.78 0.1 250);
  --color-primary-fg: oklch(0.17 0.02 250);
  --color-accent: oklch(0.8 0.12 75);
  --color-accent-fg: oklch(0.2 0.03 60);
  --color-link: oklch(0.82 0.09 250);
  --color-focus: oklch(0.82 0.12 250);
  --color-success: oklch(0.75 0.12 150);
  --color-warning: oklch(0.8 0.13 80);
  --color-danger: oklch(0.72 0.15 28);
  --color-overlay: oklch(0 0 0 / 0.65);
  --shadow: 0 1px 2px oklch(0 0 0 / 0.4), 0 8px 24px oklch(0 0 0 / 0.35);
  --shadow-lg: 0 2px 4px oklch(0 0 0 / 0.4), 0 18px 48px oklch(0 0 0 / 0.45);
}

@media (prefers-reduced-motion: reduce) {
  :root { --motion: 0; }
}

:root {
  --color-bg: #ffffff;
  --color-surface: #f3f9f9;
  --color-surface-2: #e5f3f2;
  --color-fg: #333c42;
  --color-fg-muted: #5b656c;
  --color-line: #dde8e8;
  --color-line-strong: #76838a;
  --color-primary: #0b6e6b;
  --color-primary-fg: #ffffff;
  --color-accent: #087a76;
  --color-accent-fg: #ffffff;
  --color-link: #087a76;
  --color-focus: #087a76;
  --radius: 16px;
  --weight-display: 600;
  --tracking-display: -0.035em;
  --leading-tight: 1.04;
  --step-5: clamp(2.4rem, 1.5rem + 3.8vw, 4.6rem);
  --step-4: clamp(1.9rem, 1.4rem + 2.2vw, 3rem);
  --step-3: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem);
  --container: 72rem;
  --section-pad: clamp(3.5rem, 2rem + 5vw, 7rem);
  --shadow: 0 1px 2px rgb(21 25 28 / 0.04), 0 12px 32px rgb(21 25 28 / 0.06);
  --teal-1: #82d9d6;
  --teal-2: #55c4c2;
  --teal-3: #0abab5;
  --sun-a: #82d9d6;
  --sun-b: #55c4c2;
  --sun-c: #0abab5;
  --ink: #1f272c;
  --on-ink: #ffffff;
  --glow-sun: transparent;
  --glow-rose: transparent;
  --font-display: "Poppins", "Poppins Fallback", system-ui, sans-serif;
  --font-body: "Poppins", "Poppins Fallback", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
  --color-bg: #0f0c12;
  --color-surface: #17131b;
  --color-surface-2: #211a26;
  --color-fg: #f3ece4;
  --color-fg-muted: #c0b5ad;
  --color-line: #2c2431;
  --color-line-strong: #8b8088;
  --color-primary: #f2b27a;
  --color-primary-fg: #24120a;
  --color-accent: #55c4c2;
  --color-accent-fg: #04201f;
  --color-link: #f5c194;
  --color-focus: #f5c194;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 14px 36px rgb(0 0 0 / 0.35);
  --ink: #08060a;
  --glow-sun: rgb(240 130 80 / 0.14);
  --glow-rose: rgb(170 70 120 / 0.10);
  --sun-a: #f6b37a;
  --sun-b: #e36a4f;
  --sun-c: #8a4a8e;
}
}
:root[data-theme="dark"] {
  --color-bg: #0f0c12;
  --color-surface: #17131b;
  --color-surface-2: #211a26;
  --color-fg: #f3ece4;
  --color-fg-muted: #c0b5ad;
  --color-line: #2c2431;
  --color-line-strong: #8b8088;
  --color-primary: #f2b27a;
  --color-primary-fg: #24120a;
  --color-accent: #55c4c2;
  --color-accent-fg: #04201f;
  --color-link: #f5c194;
  --color-focus: #f5c194;
  --shadow: 0 1px 2px rgb(0 0 0 / 0.3), 0 14px 36px rgb(0 0 0 / 0.35);
  --ink: #08060a;
  --glow-sun: rgb(240 130 80 / 0.14);
  --glow-rose: rgb(170 70 120 / 0.10);
  --sun-a: #f6b37a;
  --sun-b: #e36a4f;
  --sun-c: #8a4a8e;
}

/* Core base: reset, type, layout primitives, buttons, forms. Tokens only. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) { html:not([data-motion-off]) { scroll-behavior: smooth; } }
body {
  margin: 0; min-height: 100vh; background: var(--color-bg); color: var(--color-fg);
  font-family: var(--font-body); font-size: var(--step-0); line-height: var(--leading); font-weight: var(--weight-body);
  overflow-wrap: break-word; hyphens: auto; text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: var(--weight-display); line-height: var(--leading-tight); letter-spacing: var(--tracking-display); margin: 0 0 var(--space-3); overflow-wrap: break-word; text-wrap: balance; hyphens: manual; }
h1 { font-size: var(--step-5); }
h2 { font-size: var(--step-4); }
h3 { font-size: var(--step-2); }
h4 { font-size: var(--step-1); }
p, ul, ol, dl, table, figure, blockquote { margin: 0 0 var(--space-4); }
p { text-wrap: pretty; }
a { color: var(--color-link); text-underline-offset: 0.18em; text-decoration-thickness: 0.08em; }
a:hover { text-decoration-thickness: 0.14em; }
strong { font-weight: var(--weight-strong); }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; border-radius: var(--radius-sm); }
::selection { background: var(--color-accent); color: var(--color-accent-fg); }
table { border-collapse: collapse; width: 100%; }
th, td { text-align: start; padding: var(--space-2) var(--space-3); border-block-end: var(--border) solid var(--color-line); vertical-align: top; }
th { font-weight: var(--weight-strong); }
[hidden] { display: none !important; }

.skip-link { position: absolute; inset-inline-start: var(--space-3); inset-block-start: -10rem; z-index: 100; background: var(--color-primary); color: var(--color-primary-fg); padding: var(--space-2) var(--space-4); border-radius: var(--radius-sm); }
.skip-link:focus { inset-block-start: var(--space-3); }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* layout */
.wrap { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--wide { max-width: var(--container-wide); }
.section { padding-block: var(--section-pad); }
.section--alt { background: var(--color-surface); }
.section__head { max-width: var(--measure); margin-block-end: var(--space-6); }
.section__head p { color: var(--color-fg-muted); font-size: var(--step-1); }
.measure { max-width: var(--measure); }
.grid { display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--grid-min, 16rem)), 1fr)); }
.grid > *, .split > * { min-width: 0; }
.split { display: grid; gap: var(--space-6); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 900px) { .split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .split--wide-left { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); } }
.stack > * + * { margin-block-start: var(--space-4); }
.muted { color: var(--color-fg-muted); }
.small { font-size: var(--step--1); }
.lead { font-size: var(--step-1); max-width: var(--measure); }
.card { background: var(--color-surface); border: var(--border) solid var(--color-line); border-radius: var(--radius); padding: var(--space-5); min-width: 0; }
.section--alt .card { background: var(--color-bg); }
.media { border-radius: var(--radius); overflow: hidden; background: var(--color-surface-2); }
.media img { width: 100%; height: 100%; object-fit: cover; }
.index-num { font-family: var(--font-display); color: var(--color-fg-muted); font-variant-numeric: tabular-nums; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--tap); padding: var(--space-2) var(--space-5); border-radius: var(--radius); border: var(--border) solid transparent; font: inherit; font-weight: var(--weight-strong); line-height: 1.2; text-decoration: none; cursor: pointer; text-align: center; max-width: 100%; transition: background-color var(--dur-1) var(--ease), transform var(--dur-1) var(--ease); }
.btn--primary { background: var(--color-primary); color: var(--color-primary-fg); }
.btn--primary:hover { background: color-mix(in oklch, var(--color-primary) 88%, var(--color-fg)); }
.btn--ghost { background: transparent; color: var(--color-fg); border-color: var(--color-line-strong); }
.btn--ghost:hover { background: var(--color-surface-2); }
.btn--accent { background: var(--color-accent); color: var(--color-accent-fg); }
.btn:active { transform: translateY(1px); }
.actions { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.textlink { font-weight: var(--weight-strong); }

/* forms */
.form { display: grid; gap: var(--space-4); }
.field { display: grid; gap: var(--space-1); min-width: 0; }
.field label { font-weight: var(--weight-strong); }
.field .hint { color: var(--color-fg-muted); font-size: var(--step--1); }
.field input, .field select, .field textarea { width: 100%; min-height: var(--tap); font: inherit; color: var(--color-fg); background: var(--color-bg); border: var(--border) solid var(--color-line-strong); border-radius: var(--radius-sm); padding: var(--space-2) var(--space-3); }
.field textarea { min-height: 8rem; resize: vertical; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 1px; }
.field .error { color: var(--color-danger); font-size: var(--step--1); min-height: 0; }
.form__row { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.form__trust { color: var(--color-fg-muted); font-size: var(--step--1); margin: 0; }
.form__status { font-weight: var(--weight-strong); }
.form__status[data-state="error"] { color: var(--color-danger); }
.form__done { border: var(--border) solid var(--color-success); border-radius: var(--radius); padding: var(--space-5); }
.hp { position: absolute; inset-inline-start: -100vw; width: 1px; height: 1px; overflow: hidden; }

/* shell parts */
.crumbs { font-size: var(--step--1); color: var(--color-fg-muted); padding-block: var(--space-3) 0; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-2); padding: 0; margin: 0; }
.crumbs li + li::before { content: "/"; margin-inline-end: var(--space-2); color: var(--color-fg-muted); }
.crumbs a { color: inherit; }
.page-title { padding-block: var(--space-7) var(--space-4); }
.updated { color: var(--color-fg-muted); font-size: var(--step--1); padding-block: var(--space-4); border-block-start: var(--border) solid var(--color-line); }
.preview-mark { position: fixed; inset-block-start: 0; inset-inline: 0; z-index: 90; background: var(--color-warning); color: var(--color-accent-fg); text-align: center; font-weight: var(--weight-strong); font-size: var(--step--1); padding: var(--space-1) var(--space-3); pointer-events: none; }
.has-preview { padding-block-start: 2rem; }
.demo-note { font-size: var(--step--1); color: var(--color-fg-muted); }

/* motion: reveal is opt-in by the skin's motion module; content is visible without JS */
.js-motion [data-reveal]:not(.is-in) { opacity: 0; transform: translateY(var(--reveal-distance)); }
@media print { .js-motion [data-reveal] { opacity: 1 !important; transform: none !important; } .sticky, .site-header, .promo { display: none !important; } }
.js-motion [data-reveal] { transition: opacity var(--dur-3) var(--ease), transform var(--dur-3) var(--ease); }
@media (prefers-reduced-motion: reduce) { .js-motion [data-reveal]:not(.is-in) { opacity: 1; transform: none; } *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } }

/* about */
.about__grid { --grid-min: 18rem; }
.about__part h3, .about__story h3 { font-size: var(--step-1); }
.about__part p:last-child { margin-block-end: 0; }
.about__story { max-width: var(--measure); }
.about__people { margin-block-start: var(--space-6); }
.s-about--b .about__people { margin-block-start: 0; }
.about__team { list-style: none; padding: 0; display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); }
.about__team p { margin: var(--space-2) 0 0; }

/* areas */
.areas__chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.areas__chips li { border: var(--border) solid var(--color-line-strong); border-radius: var(--radius-pill); padding: var(--space-1) var(--space-4); max-width: 100%; }
.areas__cols { list-style: none; padding: 0; margin: 0; columns: 2 12rem; column-gap: var(--space-6); }
.areas__cols li { break-inside: avoid; padding-block: var(--space-2); border-block-end: var(--border) solid var(--color-line); }

/* booking */
.booking__steps { padding-inline-start: var(--space-5); }
.booking__steps li + li { margin-block-start: var(--space-2); }
.booking__band { max-width: calc(52rem + 2 * var(--gutter)); }
.s-booking--b .form { background: var(--color-bg); border-radius: var(--radius); padding: var(--space-5); border: var(--border) solid var(--color-line); }

/* contact */
.contact__rows { display: grid; gap: var(--space-4); margin: 0; }
.contact__rows dt { color: var(--color-fg-muted); font-size: var(--step--1); }
.contact__rows dd { margin: 0; font-weight: var(--weight-strong); }
.contact__narrow { max-width: calc(46rem + 2 * var(--gutter)); }
.s-contact--b .contact__head { text-align: center; margin-inline: auto; }
.s-contact--b .contact__rows { margin-block-start: var(--space-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.contact__form { box-shadow: var(--shadow); }
.enquiry__title { font-size: var(--step-2); }

/* faq */
.faq__wrap { max-width: calc(var(--measure) + 2 * var(--gutter)); }
.faq__list { border-block-start: var(--border) solid var(--color-line); }
.faq__item { border-block-end: var(--border) solid var(--color-line); }
.faq__item summary { cursor: pointer; list-style: none; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-4); align-items: center; padding-block: var(--space-4); min-height: var(--tap); font-weight: var(--weight-strong); font-size: var(--step-1); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; font-size: var(--step-2); color: var(--color-fg-muted); transition: transform var(--dur-1) var(--ease); }
.faq__item[open] summary::after { transform: rotate(45deg); }
.faq__a { padding-block-end: var(--space-4); max-width: var(--measure); }
.faq__a p { margin: 0; }
@media (min-width: 900px) { .split--faq { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); } }

/* footer */
.site-footer { background: var(--color-surface); border-block-start: var(--border) solid var(--color-line); padding-block: var(--space-7) var(--space-5); margin-block-start: 0; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { padding-block: var(--space-1); }
.site-footer a { color: var(--color-fg); }
.foot__cols { display: grid; gap: var(--space-6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.foot__h { font-weight: var(--weight-strong); margin-block-end: var(--space-2); }
.foot__name { font-family: var(--font-display); font-size: var(--step-1); display: flex; align-items: center; gap: var(--space-2); }
.foot__name svg { width: 1.75rem; height: 1.75rem; color: var(--color-primary); flex: none; }
.foot__bottom { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-5); justify-content: space-between; border-block-start: var(--border) solid var(--color-line); margin-block-start: var(--space-6); padding-block-start: var(--space-4); color: var(--color-fg-muted); }
.foot__bottom p { margin: 0; }
.foot__row { display: grid; gap: var(--space-4); }
.foot__inline { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-5); }
.foot__inline li { min-height: var(--tap); display: flex; align-items: center; }

/* gallery */
.gallery__grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); }
.gallery__fig { margin: 0; min-width: 0; }
.gallery__fig .media { aspect-ratio: 4 / 3; }
.gallery__fig figcaption { margin-block-start: var(--space-2); }
.gallery__row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(16rem, 70vw); gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; padding-inline: var(--gutter); padding-block-end: var(--space-3); scroll-padding-inline: var(--gutter); overscroll-behavior-x: contain; }
@media (min-width: 900px) { .gallery__row { grid-auto-columns: minmax(18rem, 28rem); padding-inline: max(var(--gutter), calc((100% - var(--container)) / 2 + var(--gutter))); } }
.gallery__row .gallery__fig { scroll-snap-align: start; }

/* hero */
.s-hero { padding-block: clamp(2rem, 1rem + 4vw, 5rem); }
.hero__kicker { font-family: var(--font-display); color: var(--color-fg-muted); font-size: var(--step-1); margin-block-end: var(--space-3); }
.hero__answer { color: var(--color-fg); }
.s-hero h1 { max-width: 20ch; }
.s-hero--a .hero__grid { align-items: center; }
.s-hero--a .hero__media { aspect-ratio: 4 / 3; box-shadow: var(--shadow-lg); }
.s-hero--b .hero__center { text-align: center; display: grid; justify-items: center; }
.s-hero--b .hero__center h1 { margin-inline: auto; }
.s-hero--b .actions { justify-content: center; }
.s-hero--b .hero__wide { margin-block-start: var(--space-7); aspect-ratio: 21 / 9; }
@media (max-width: 599px) { .s-hero--b .hero__wide { aspect-ratio: 4 / 3; } }
.s-hero--c .hero__type { display: grid; gap: var(--space-7); grid-template-columns: minmax(0, 1fr); align-items: end; }
@media (min-width: 900px) { .s-hero--c .hero__type { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }
.s-hero--c h1 { font-size: clamp(2.2rem, 1.4rem + 4vw, 5rem); max-width: 16ch; }
.hero__facts { display: grid; gap: var(--space-4); margin: 0; border-inline-start: 3px solid var(--color-accent); padding-inline-start: var(--space-5); }
.hero__facts dt { color: var(--color-fg-muted); font-size: var(--step--1); }
.hero__facts dd { margin: 0; font-family: var(--font-display); font-size: var(--step-2); }

/* nav */
.site-header { position: sticky; inset-block-start: 0; z-index: 50; background: color-mix(in oklch, var(--color-bg) 92%, transparent); backdrop-filter: blur(10px); border-block-end: var(--border) solid var(--color-line); }
.nav__bar { display: flex; align-items: center; gap: var(--space-3) var(--space-5); min-height: 4rem; padding-block: var(--space-2); }
.nav__brand { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--color-fg); text-decoration: none; font-family: var(--font-display); font-weight: var(--weight-display); font-size: var(--step-1); min-width: 0; min-height: var(--tap); }
.nav__brand svg { width: 2rem; height: 2rem; flex: none; color: var(--color-primary); }
.nav__brand span { overflow-wrap: anywhere; }
.nav__main ul, .nav__panel ul { list-style: none; margin: 0; padding: 0; }
.nav__main ul { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-4); }
.nav__main a { color: var(--color-fg); text-decoration: none; padding-block: var(--space-2); display: inline-block; }
.nav__main a:hover, .nav__main a[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: 0.15em; }
.nav__tools { display: flex; align-items: center; gap: var(--space-2); margin-inline-start: auto; }
.nav__icon { display: inline-grid; place-items: center; width: var(--tap); height: var(--tap); border-radius: var(--radius-pill); border: var(--border) solid var(--color-line); background: transparent; color: var(--color-fg); cursor: pointer; }
.nav__icon[aria-pressed="true"] { background: var(--color-surface-2); }
.nav__back { display: none; color: var(--color-fg); text-decoration: none; min-height: var(--tap); align-items: center; padding-inline-end: var(--space-2); }
.nav__menu { display: none; }
.nav__drawer { position: fixed; inset: 0; z-index: 80; background: var(--color-overlay); display: flex; justify-content: flex-end; }
.nav__drawer[hidden] { display: none; }
.nav__panel { background: var(--color-bg); width: min(22rem, 88vw); height: 100%; overflow-y: auto; padding: var(--space-5); display: grid; align-content: start; gap: var(--space-4); box-shadow: var(--shadow-lg); }
.nav__panel ul a { display: block; padding-block: var(--space-3); font-size: var(--step-1); color: var(--color-fg); text-decoration: none; border-block-end: var(--border) solid var(--color-line); }
.nav__panel ul a[aria-current="page"] { font-weight: var(--weight-strong); }
.nav__close { justify-self: end; }
@media (max-width: 959px) {
  .nav__main, .nav__cta { display: none; }
  .nav__menu { display: inline-flex; }
  .nav__back { display: inline-flex; }
  .nav__brand { font-size: var(--step-0); }
}
@media (min-width: 960px) {
  .nav--b .nav__bar { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); padding-block: var(--space-3) 0; }
  .nav--b .nav__brand { grid-column: 2; justify-self: center; font-size: var(--step-2); }
  .nav--b .nav__tools { grid-column: 3; justify-self: end; }
  .nav--b .nav__main { grid-column: 1 / -1; grid-row: 2; justify-self: center; }
  .nav--b .nav__back { display: none; }
}

/* pricing */
.pricing__cards { --grid-min: 15rem; margin-block-end: var(--space-5); }
.pricing__card { display: grid; gap: var(--space-2); align-content: start; }
.pricing__card h3 { font-size: var(--step-1); margin: 0; }
.pricing__price { font-family: var(--font-display); font-size: var(--step-3); margin: 0; }
.pricing__note { max-width: var(--measure); color: var(--color-fg-muted); }
.pricing__scroll { overflow-x: auto; margin-block-end: var(--space-4); }
.pricing__table { min-width: 28rem; background: var(--color-bg); }

/* process */
.process__cols { list-style: none; padding: 0; margin: 0; counter-reset: step; display: grid; gap: var(--space-5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.process__cols li { counter-increment: step; border-block-start: 3px solid var(--color-primary); padding-block-start: var(--space-4); min-width: 0; }
.process__cols li::before { content: counter(step, decimal-leading-zero); display: block; font-family: var(--font-display); font-size: var(--step-3); color: var(--color-fg-muted); margin-block-end: var(--space-2); }
.process__cols h3, .process__line h3 { font-size: var(--step-1); }
.process__cols p, .process__line p { margin: 0; color: var(--color-fg-muted); }
.process__line { list-style: none; margin: 0; padding: 0; counter-reset: step; }
.process__line li { counter-increment: step; position: relative; padding-inline-start: var(--space-7); padding-block-end: var(--space-6); border-inline-start: 2px solid var(--color-line-strong); margin-inline-start: var(--space-4); }
.process__line li:last-child { border-color: transparent; padding-block-end: 0; }
.process__line li::before { content: counter(step); position: absolute; inset-inline-start: -1.25rem; inset-block-start: 0; width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: var(--radius-pill); background: var(--color-primary); color: var(--color-primary-fg); font-weight: var(--weight-strong); }

/* promo-banner */
.promo { font-size: var(--step--1); }
.promo__inner { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); align-items: center; justify-content: space-between; padding-block: var(--space-2); }
.promo__text { margin: 0; flex: 1 1 16rem; min-width: 0; }
.promo__close { background: transparent; border: var(--border) solid currentColor; color: inherit; border-radius: var(--radius-sm); min-height: 2rem; min-width: var(--tap); padding: 0 var(--space-3); font: inherit; cursor: pointer; }
.promo--a { background: var(--color-primary); color: var(--color-primary-fg); }
.promo--a a { color: inherit; }
.promo--b .promo__inner { margin-block-start: var(--space-3); background: var(--color-surface-2); border: var(--border) solid var(--color-line); border-radius: var(--radius); padding: var(--space-2) var(--space-4); max-width: calc(var(--container) - 2 * var(--gutter)); width: calc(100% - 2 * var(--gutter)); }
.promo--warning.promo--a { background: var(--color-accent); color: var(--color-accent-fg); }

/* proof */
.proof__grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); margin: 0; }
.proof__item { background: var(--color-bg); border: var(--border) solid var(--color-line); border-radius: var(--radius); padding: var(--space-4); min-width: 0; }
.proof__item dt { color: var(--color-fg-muted); font-size: var(--step--1); }
.proof__item dd { margin: var(--space-1) 0 0; font-family: var(--font-display); font-size: var(--step-1); }
.proof__item .source { font-family: var(--font-body); }
.s-proof--b .measure-wrap > * { max-width: 48rem; }
.proof__table th { width: 38%; color: var(--color-fg-muted); font-weight: var(--weight-body); }

/* prose */
.prose h2 { font-size: var(--step-3); margin-block-start: var(--space-6); }
.prose h2:first-child { margin-block-start: 0; }
.prose h3 { font-size: var(--step-1); margin-block-start: var(--space-5); }
.prose ul, .prose ol { padding-inline-start: var(--space-5); }
.prose li + li { margin-block-start: var(--space-1); }
.prose__grid { display: grid; gap: var(--space-6); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .prose__grid { grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); } .prose__toc { position: sticky; inset-block-start: 6rem; align-self: start; } }
.prose__toc ul { list-style: none; padding: 0; margin: 0; }
.prose__toc li { padding-block: var(--space-1); }

/* services */
.services__cards { --grid-min: 17rem; }
.services__card h3 { font-size: var(--step-2); }
.services__card h3 a { color: var(--color-fg); text-decoration: none; }
.services__card h3 a:hover { text-decoration: underline; }
.services__media { aspect-ratio: 3 / 2; margin-block-end: var(--space-4); }
.services__price { margin: 0; }
.services__rows { list-style: none; padding: 0; margin: 0; border-block-start: var(--border) solid var(--color-line); }
.services__row { display: grid; grid-template-columns: minmax(2.5rem, auto) minmax(0, 1fr); gap: var(--space-2) var(--space-5); padding-block: var(--space-5); border-block-end: var(--border) solid var(--color-line); align-items: baseline; }
.services__row .index-num { font-size: var(--step-3); }
.services__row .services__price { grid-column: 2; }
@media (min-width: 900px) { .services__row { grid-template-columns: 5rem minmax(0, 1fr) minmax(0, 14rem); } .services__row .services__price { grid-column: 3; text-align: end; } }
.services__body h3 { margin-block-end: var(--space-2); }
.services__body h3 a { color: var(--color-fg); }
.services__body p { margin: 0; color: var(--color-fg-muted); }

/* sticky-cta: phones only */
.sticky { display: none; }
@media (max-width: 899px) {
  body.has-sticky { padding-block-end: 5rem; }
  .sticky { display: flex; position: fixed; z-index: 60; transition: transform var(--dur-2) var(--ease), opacity var(--dur-2) var(--ease); }
  .sticky.is-hidden { transform: translateY(120%); opacity: 0; pointer-events: none; }
  .sticky--a { inset-inline: 0; inset-block-end: 0; padding: var(--space-2) var(--gutter); gap: var(--space-3); align-items: center; background: var(--color-bg); border-block-start: var(--border) solid var(--color-line); box-shadow: var(--shadow); }
  .sticky--a .sticky__btn { flex: 1 1 auto; }
  .sticky__note { margin: 0; flex: 1 1 40%; min-width: 0; color: var(--color-fg-muted); }
  .sticky--b { inset-inline-end: var(--gutter); inset-block-end: var(--space-4); }
  .sticky--b .sticky__btn { border-radius: var(--radius-pill); box-shadow: var(--shadow-lg); }
}

/* testimonials */
.testimonials__fig { margin: 0; }
.testimonials__fig blockquote { margin: 0 0 var(--space-3); }
.testimonials__fig blockquote p { margin: 0; }
.testimonials__grid blockquote p { font-size: var(--step-1); }
.testimonials__col { max-width: calc(52rem + 2 * var(--gutter)); }
.testimonials__list { display: grid; gap: var(--space-7); }
.testimonials__big blockquote p { font-family: var(--font-display); font-size: var(--step-3); line-height: var(--leading-tight); }
.testimonials__big { border-inline-start: 4px solid var(--color-accent); padding-inline-start: var(--space-5); }

/* work */
.work__cards { --grid-min: 22rem; }
.work__media { aspect-ratio: 3 / 2; margin-block-end: var(--space-4); }
.work__meta { margin-block-end: var(--space-2); }
.work__results { font-size: var(--step--1); margin-block-start: var(--space-3); }
.work__results th[scope="row"] { font-weight: var(--weight-body); color: var(--color-fg-muted); }
.work__card h4, .work__row h4 { font-family: var(--font-body); font-size: var(--step-0); font-weight: var(--weight-strong); margin-block: var(--space-4) var(--space-1); letter-spacing: 0; }
.work__rows { display: grid; gap: var(--space-8); }
@media (min-width: 900px) { .work__row:nth-child(even) > .media { order: 2; } }

/* icc-sunset: Ibiza Creative Club. Tokens only.
   The club's Poppins, its three teals and slate on white, hairlines; an Ibiza sunset in dark mode. */

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 0.35s; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } @view-transition { navigation: none; } }

body {
  background:
    radial-gradient(60rem 40rem at 90% -10%, var(--glow-sun), transparent 70%),
    radial-gradient(50rem 36rem at -10% 40%, var(--glow-rose), transparent 70%),
    var(--color-bg);
  -webkit-font-smoothing: antialiased;
}
::selection { background: var(--sun-a); color: var(--ink); }
h1 { text-wrap: balance; }

/* type: Poppins throughout, tight and confident */
h1, h2 { font-family: var(--font-display); font-weight: 600; letter-spacing: var(--tracking-display); }
h3 { font-family: var(--font-body); font-weight: 600; font-size: var(--step-1); letter-spacing: -0.01em; }
.section__head::before { content: ""; display: block; inline-size: 2.5rem; block-size: 1px; margin-block-end: var(--space-5); background: var(--color-fg); opacity: 0.5; }
.section__head p, .lead { color: var(--color-fg-muted); }

/* inner page hero: a calm editorial title band with the sunset as a hairline */
.s-hero { position: relative; padding-block: clamp(4rem, 2rem + 6vw, 8rem) clamp(2.5rem, 1.5rem + 3vw, 4.5rem); border-block-end: 1px solid var(--color-line); }
.s-hero::after { content: ""; position: absolute; inset-inline: 0; inset-block-end: -1px; block-size: 2px; background: linear-gradient(90deg, transparent, var(--sun-a), var(--sun-b), var(--sun-c), transparent); opacity: 0.7; }
.s-hero h1 { font-size: clamp(2.1rem, 1.4rem + 2.8vw, 3.6rem); max-width: 22ch; margin-inline: auto; }
.s-hero .hero__kicker { font-size: var(--step--1); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-fg-muted); }
.s-hero .hero__answer { max-width: 56ch; color: var(--color-fg-muted); }

/* buttons: ink pills with a slow fill */
.btn { border-radius: var(--radius-pill); font-weight: 500; font-size: var(--step--1); letter-spacing: 0.01em; padding-inline: var(--space-6); transition: background-color 0.3s var(--ease), color 0.3s var(--ease), transform 0.3s var(--ease); }
.btn:hover { transform: translateY(-1px); }

/* header */
.site-header { background: color-mix(in oklch, var(--color-bg) 82%, transparent); backdrop-filter: blur(16px) saturate(1.2); border-block-end-color: var(--color-line); }
.nav__brand { font-family: var(--font-body); font-weight: 600; font-size: var(--step-0); letter-spacing: -0.01em; color: var(--color-fg); }
.nav__brand span { white-space: nowrap; }
.nav__brand svg { inline-size: 1.75rem; block-size: 1.75rem; }
.nav__main a { font-size: var(--step--1); }
@media (max-width: 520px) {
  .nav__brand span { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}

/* cards and rows: hairlines, no heavy boxes */
.card, .services__card { border: 1px solid var(--color-line); border-radius: var(--radius); box-shadow: none; background: var(--color-surface); transition: border-color 0.3s var(--ease), transform 0.3s var(--ease), box-shadow 0.3s var(--ease); }
.services__card:hover { border-color: var(--color-fg); transform: translateY(-3px); box-shadow: var(--shadow); }
.services__row { transition: background-color 0.3s var(--ease); }
.media { border-radius: var(--radius); }
.section--alt { background: var(--color-surface); }

/* footer: ink, with the sunset hairline */
.site-footer { position: relative; background: var(--ink); color: var(--on-ink); --color-fg: var(--on-ink); --color-fg-muted: var(--on-ink); --color-link: var(--on-ink); --color-line: color-mix(in oklch, var(--on-ink) 18%, transparent); }
.site-footer::before { content: ""; position: absolute; inset-inline: 0; inset-block-start: 0; block-size: 2px; background: linear-gradient(90deg, var(--sun-a), var(--sun-b), var(--sun-c)); }
.foot__name { font-weight: 600; font-size: var(--step-2); letter-spacing: -0.02em; }

/* quiet rise */
.js-motion [data-reveal] { opacity: 0; transform: translateY(14px); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); }
.js-motion [data-reveal].is-in { opacity: 1; transform: none; }
