/* ==========================================================================
   PmPc — Puerto Morelos Inspection · Cleaning
   Production stylesheet. Tokens below are carried over verbatim from the
   PmPc design system (tokens/*.css) so the site matches the brand exactly.
   ========================================================================== */

:root{
  /* Brand base */
  --blue-900:#0E1B29;--blue-800:#132437;--blue-700:#1A2E44;--blue-600:#24415F;--blue-500:#2F587F;--blue-400:#4B7CA6;--blue-300:#8FB0CB;--blue-200:#C7D7E4;
  --teal-700:#177F8A;--teal-600:#1E9EAB;--teal-500:#2FB7C4;--teal-400:#3AC9D6;--teal-300:#76DCE6;--teal-200:#B4EDF3;--teal-100:#E1F7FA;
  --gold-700:#8F7412;--gold-600:#B8961F;--gold-500:#CFAC2E;--gold-400:#E2C33D;--gold-300:#EEDA83;--gold-200:#F8EFC6;
  --dune-100:#FBF9F6;--dune-200:#F5F1EB;--dune-300:#EBE5DC;--dune-400:#DCD4C7;--dune-500:#B8AFA0;--dune-600:#8A8175;--dune-700:#5C564D;
  --white:#FFFFFF;
  --green-500:#2F9E6B;--green-100:#E2F3EB;--red-500:#BE4630;--red-100:#F8E6E2;

  --text-heading:var(--blue-700);--text-body:var(--blue-800);--text-muted:var(--dune-700);--text-inverse:var(--white);--text-on-teal:var(--blue-900);
  --text-link:var(--teal-700);--text-link-hover:var(--blue-700);
  --surface-page:var(--dune-200);--surface-card:var(--white);--surface-raised:var(--dune-100);--surface-sunken:var(--dune-300);
  --surface-dark:var(--blue-700);--surface-dark-deep:var(--blue-900);--surface-accent:var(--teal-400);--surface-accent-soft:var(--teal-100);--surface-premium:var(--gold-400);--surface-premium-soft:var(--gold-200);
  --border-subtle:var(--dune-300);--border-default:var(--dune-400);--border-strong:var(--blue-700);--border-accent:var(--teal-400);--border-premium:var(--gold-400);
  --action-primary:var(--teal-400);--action-primary-hover:var(--teal-500);--action-primary-active:var(--teal-600);
  --action-secondary:var(--blue-700);--action-secondary-hover:var(--blue-600);--action-secondary-active:var(--blue-800);
  --focus-ring:var(--teal-600);
  --status-pass:var(--green-500);--status-pass-soft:var(--green-100);--status-flag:var(--gold-400);--status-flag-soft:var(--gold-200);--status-fail:var(--red-500);--status-fail-soft:var(--red-100);

  /* Type */
  --font-display:'Montserrat',-apple-system,'Segoe UI',sans-serif;
  --font-body:'Lato',-apple-system,'Segoe UI',sans-serif;
  --fw-light:300;--fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--fw-extrabold:800;
  --text-3xs:11px;--text-2xs:12px;--text-xs:13px;--text-sm:15px;--text-base:17px;--text-lg:19px;--text-xl:23px;--text-2xl:28px;--text-3xl:34px;--text-4xl:44px;--text-5xl:56px;--text-6xl:72px;
  --lh-tight:1.05;--lh-snug:1.2;--lh-normal:1.45;--lh-relaxed:1.65;
  --ls-display:-0.02em;--ls-normal:0;--ls-wide:0.04em;--ls-eyebrow:0.14em;
  --type-hero:var(--fw-extrabold) var(--text-5xl)/var(--lh-tight) var(--font-display);
  --type-h1:var(--fw-bold) var(--text-4xl)/var(--lh-snug) var(--font-display);
  --type-h2:var(--fw-bold) var(--text-2xl)/var(--lh-snug) var(--font-display);
  --type-h3:var(--fw-semibold) var(--text-xl)/var(--lh-snug) var(--font-display);
  --type-eyebrow:var(--fw-bold) var(--text-2xs)/var(--lh-normal) var(--font-display);
  --type-body:var(--fw-regular) var(--text-base)/var(--lh-relaxed) var(--font-body);
  --type-body-lg:var(--fw-light) var(--text-lg)/var(--lh-relaxed) var(--font-body);
  --type-small:var(--fw-regular) var(--text-sm)/var(--lh-normal) var(--font-body);
  --type-label:var(--fw-bold) var(--text-xs)/var(--lh-normal) var(--font-display);

  /* Spacing */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;
  --gutter:var(--space-5);--section-y:var(--space-9);--container-max:1200px;--container-narrow:720px;
  --control-h-sm:36px;--control-h-md:46px;--control-h-lg:56px;

  /* Elevation */
  --radius-xs:4px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px;--radius-circle:50%;
  --shadow-sm:0 1px 2px rgba(14,27,41,.08);
  --shadow-md:0 4px 14px rgba(14,27,41,.10);
  --shadow-lg:0 14px 36px rgba(14,27,41,.14);
  --shadow-teal:0 8px 22px rgba(47,183,196,.30);
  --border-w:1px;--border-w-thick:3px;
  --ease-out:cubic-bezier(.22,.7,.3,1);
  --dur-fast:120ms;--dur-base:200ms;--dur-slow:380ms;
  --blur-glass:saturate(140%) blur(12px);
}

/* ---- Reset & base ---- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);-webkit-font-smoothing:antialiased;text-wrap:pretty;overflow-x:hidden}
img,picture{max-width:100%;display:block}
h1,h2,h3,h4{color:var(--text-heading);margin:0 0 var(--space-3);letter-spacing:var(--ls-display)}
h1{font:var(--type-h1)}h2{font:var(--type-h2)}h3{font:var(--type-h3)}
p{margin:0 0 var(--space-4)}
ul,ol{margin:0;padding:0}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-link-hover)}
button{font-family:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.eyebrow{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--teal-700)}
.container{max-width:var(--container-max);margin:0 auto;padding-inline:var(--space-5)}
.rule{height:var(--border-w-thick);width:56px;background:var(--blue-700);border:0;margin:var(--space-4) 0}

.icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;vertical-align:middle}
.icon svg{width:100%;height:100%;display:block}

/* ---- Buttons ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  font:var(--fw-bold) var(--text-xs)/1 var(--font-display);letter-spacing:var(--ls-wide);text-transform:uppercase;
  border-radius:var(--radius-pill);border:var(--border-w-thick) solid transparent;cursor:pointer;text-decoration:none;
  transition:background var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);white-space:nowrap}
.btn-sm{height:var(--control-h-sm);padding:0 var(--space-4);font-size:var(--text-2xs)}
.btn-md{height:var(--control-h-md);padding:0 var(--space-5);font-size:var(--text-xs)}
.btn-lg{height:var(--control-h-lg);padding:0 var(--space-6);font-size:var(--text-sm)}
.btn-full{width:100%}
.btn-primary{background:var(--action-primary);color:var(--blue-900)}
.btn-primary:hover{background:var(--action-primary-hover);box-shadow:var(--shadow-teal)}
.btn-secondary{background:var(--action-secondary);color:var(--white)}
.btn-secondary:hover{background:var(--action-secondary-hover);box-shadow:var(--shadow-md)}
.btn-secondary-aqua:hover{background:var(--teal-400);color:var(--blue-900);box-shadow:var(--shadow-teal)}
.btn-outline{background:transparent;color:var(--blue-700);border-color:var(--blue-700)}
.btn-outline:hover{background:var(--dune-300)}
.btn-ghost{background:transparent;color:var(--teal-700)}
.btn-ghost:hover{background:var(--teal-100)}

/* ---- Badges ---- */
.badge{display:inline-flex;align-items:center;gap:var(--space-2);padding:5px var(--space-3);border-radius:var(--radius-pill);
  font:var(--fw-bold) var(--text-3xs)/1.3 var(--font-display);letter-spacing:var(--ls-wide);text-transform:uppercase}
.badge-neutral{background:var(--dune-300);color:var(--blue-800)}
.badge-accent{background:var(--teal-100);color:var(--teal-700)}
.badge-premium{background:var(--gold-200);color:var(--gold-700)}
.badge-pass{background:var(--status-pass-soft);color:var(--status-pass)}
.badge-flag{background:var(--status-flag-soft);color:var(--gold-700)}
.badge-fail{background:var(--status-fail-soft);color:var(--status-fail)}
.badge-dark{background:var(--blue-700);color:var(--white)}

/* ---- Cards ---- */
.card{background:var(--surface-card);color:var(--text-body);border:var(--border-w) solid var(--border-subtle);
  border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-sm)}
.card-dune{background:var(--surface-raised)}
.card-dark{background:var(--surface-dark);color:var(--white);border-color:transparent;box-shadow:var(--shadow-lg)}
.card-dark h3{color:var(--white)}
.card-accent{background:var(--surface-accent-soft);color:var(--blue-800);border-color:var(--teal-200)}
.card-flat{padding:0;overflow:hidden}
.card-edge{border-top:var(--border-w-thick) solid var(--border-accent)}

/* ---- Service card ---- */
.service-card{display:flex;flex-direction:column;gap:var(--space-3)}
.service-card .icon-badge{width:52px;height:52px;border-radius:var(--radius-circle);background:var(--surface-accent-soft);
  display:inline-flex;align-items:center;justify-content:center}
.service-card h3{margin:0}
.service-card p{color:var(--text-muted);margin:0}
.service-card ul{list-style:none;display:grid;gap:var(--space-2)}
.service-card li{display:flex;gap:var(--space-2);font:var(--type-small);color:var(--text-body)}

/* ---- Stat ---- */
.stat-value{font:var(--fw-extrabold) var(--text-4xl)/1 var(--font-display);letter-spacing:var(--ls-display);color:var(--blue-700)}
.stat-value.on-dark{color:var(--gold-400)}
.stat-label{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-muted);margin-top:var(--space-2)}
.stat-label.on-dark{color:var(--blue-200)}

/* ---- Section heading ---- */
.section-heading{margin-bottom:var(--space-6)}
.section-heading.center{text-align:center;max-width:var(--container-narrow);margin-inline:auto}
.section-heading .eyebrow{margin-bottom:var(--space-3);display:block}
.section-heading h2{font:var(--type-h1);margin:0}
.section-heading .rule{margin:var(--space-4) 0}
.section-heading.center .rule{margin-inline:auto}
.section-heading p{font:var(--type-body-lg);color:var(--text-muted);margin:0}
.section-heading.on-dark .eyebrow{color:var(--teal-300)}
.section-heading.on-dark h2{color:var(--white)}
.section-heading.on-dark .rule{background:var(--gold-400)}
.section-heading.on-dark p{color:var(--blue-200)}

/* ---- Tag toggle (services scope) ---- */
.tag{font:var(--type-small);color:var(--blue-700);background:transparent;border:var(--border-w) solid var(--border-default);
  border-radius:var(--radius-pill);padding:6px var(--space-4);cursor:pointer;display:inline-block;
  transition:background var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out)}

/* ---- Form controls ---- */
.field{display:block}
.field-label{display:block;font:var(--type-label);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--blue-700);margin-bottom:var(--space-2)}
.field-label .req{color:var(--status-fail)}
.field input[type=text],.field input[type=email],.field input[type=tel],.field textarea,.field select{
  width:100%;font:var(--type-body);color:var(--text-body);background:var(--white);
  border:var(--border-w) solid var(--border-default);border-radius:var(--radius-sm);outline:none;
  transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.field input[type=text],.field input[type=email],.field input[type=tel]{height:var(--control-h-md);padding:0 var(--space-4)}
.field textarea{min-height:112px;padding:var(--space-3);resize:vertical;font-family:inherit}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--teal-400);box-shadow:0 0 0 3px var(--teal-100)}
.field select{height:var(--control-h-md);padding:0 var(--space-4);appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--blue-700) 50%),linear-gradient(135deg,var(--blue-700) 50%,transparent 50%);
  background-position:right 20px center,right 14px center;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.checkbox{display:flex;align-items:flex-start;gap:var(--space-3);cursor:pointer;font:var(--type-body)}
.checkbox input{position:absolute;opacity:0;width:0;height:0}
.checkbox .box{width:22px;height:22px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  background:var(--white);border:var(--border-w) solid var(--border-default);border-radius:var(--radius-xs);
  transition:background var(--dur-fast) var(--ease-out)}
.checkbox .box svg{width:15px;height:15px;color:var(--blue-900);opacity:0}
.checkbox input:checked ~ .box{background:var(--teal-400);border-color:var(--teal-400)}
.checkbox input:checked ~ .box svg{opacity:1}
.checkbox input:focus-visible ~ .box{outline:2px solid var(--focus-ring);outline-offset:2px}

/* ---- Checklist item ---- */
.checklist-item{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-4);
  background:var(--white);border-bottom:var(--border-w) solid var(--border-subtle)}
.checklist-item:last-child{border-bottom:0}
.checklist-item .icon{width:18px;height:18px}
.checklist-item .icon.pass{color:var(--status-pass)}
.checklist-item .icon.flag{color:var(--gold-600)}
.checklist-item .icon.fail{color:var(--status-fail)}
.checklist-item .icon.pending{color:var(--dune-500)}
.checklist-item .body{flex:1;min-width:0}
.checklist-item .title{display:block;font:var(--fw-semibold) var(--text-sm)/1.3 var(--font-display);color:var(--text-heading)}
.checklist-item .note{display:block;font:var(--type-small);color:var(--text-muted)}

/* ==========================================================================
   Header / Nav
   ========================================================================== */
.site-header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.86);backdrop-filter:var(--blur-glass);
  -webkit-backdrop-filter:var(--blur-glass);border-bottom:var(--border-w) solid var(--border-subtle)}
.navbar{display:flex;align-items:center;justify-content:space-between;height:84px;gap:var(--space-5)}
.brand{display:inline-flex;align-items:center;gap:var(--space-3)}
.brand-mark{width:54px;height:54px;object-fit:contain}
.brand-text{line-height:1.1}
.brand-name{display:block;font:var(--fw-extrabold) var(--text-xl)/1 var(--font-display);letter-spacing:var(--ls-display);color:var(--blue-700)}
.brand-tag{display:block;font:var(--fw-light) var(--text-2xs)/1.4 var(--font-body);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--text-muted)}
.brand-mark-wrap{display:inline-flex;align-items:center;justify-content:center;background:var(--dune-200);border-radius:var(--radius-md);padding:var(--space-2)}
.footer-brand{margin-bottom:0}

.nav-toggle{display:none}
.nav-burger{display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--radius-md);
  border:var(--border-w) solid var(--border-default);background:var(--white);cursor:pointer}
.nav-burger svg{width:20px;height:20px;color:var(--blue-700)}

.site-nav{display:flex;gap:var(--space-5);align-items:center}
.nav-links{display:flex;gap:var(--space-5);align-items:center;list-style:none;margin:0;padding:0}
.nav-links a{font:var(--fw-semibold) var(--text-xs)/1 var(--font-display);letter-spacing:var(--ls-wide);text-transform:uppercase;
  color:var(--text-muted);border-bottom:2px solid transparent;padding-bottom:4px}
.nav-links a:hover{color:var(--blue-700)}
.nav-links a.active{color:var(--blue-700);border-bottom-color:var(--teal-400)}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{background:var(--surface-dark-deep);color:var(--blue-200);padding-block:var(--space-8)}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--space-7)}
.footer-grid h2,.footer-grid h3{color:var(--white)}
.footer-about p{font:var(--type-small);margin-top:var(--space-4);max-width:320px}
.footer-social{display:flex;gap:var(--space-3);margin-top:var(--space-4)}
.icon-btn{width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-circle);
  cursor:pointer;box-shadow:var(--shadow-sm);border:none;text-decoration:none;
  transition:box-shadow var(--dur-base) var(--ease-out),background var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)}
a.icon-btn:hover{background:var(--teal-400);color:var(--blue-900);border-color:transparent;box-shadow:var(--shadow-md)}
.icon-btn svg{width:21px;height:21px}
.icon-btn-solid{background:var(--action-primary);color:var(--blue-900)}
.icon-btn-dark{background:var(--surface-dark);color:var(--white);border:var(--border-w) solid var(--blue-500)}
.footer-heading{font:var(--type-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--teal-300);margin-bottom:var(--space-3)}
.footer-list{list-style:none;display:grid;gap:var(--space-2);font:var(--type-small)}
.footer-list.gap-3{gap:var(--space-3)}
.footer-list li{display:flex;gap:var(--space-2);align-items:flex-start}
.footer-list a{color:var(--blue-200)}
.footer-list a:hover{color:var(--teal-300)}
.footer-list .icon{color:var(--teal-300);width:16px;height:16px;margin-top:2px}
.footer-bottom{margin-top:var(--space-7);padding-top:var(--space-4);border-top:1px solid var(--blue-600);
  font:var(--type-small);color:var(--blue-300);display:flex;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap}
.footer-bottom a{color:var(--blue-300)}
.footer-bottom a:hover{color:var(--teal-300)}

/* ==========================================================================
   Home
   ========================================================================== */
.hero{background:var(--surface-page);padding-block:var(--space-8)}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7);align-items:center}
.hero h1{font:var(--type-hero);letter-spacing:var(--ls-display);margin:var(--space-4) 0;max-width:472px}
.hero-lead{font:var(--type-body-lg);color:var(--text-muted);max-width:520px}
.hero-actions{display:flex;gap:var(--space-3);margin-top:var(--space-5);flex-wrap:wrap}
.hero-stats{display:flex;gap:var(--space-6);margin-top:var(--space-7)}
.hero-figure{margin:0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.hero-figure img{width:100%}
.hero-logo{margin:0;display:flex;align-items:center;justify-content:center}
.hero-logo img{width:100%;height:auto;max-width:440px;margin-inline:auto}

.section-white{background:var(--white);padding-block:var(--section-y)}
.section-dark{background:var(--surface-dark);padding-block:var(--section-y)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5)}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-7);align-items:center}
.why-list{display:grid;gap:var(--space-3)}
.why-row{display:flex;gap:var(--space-4);align-items:center}
.why-row .icon{width:24px;height:24px;color:var(--teal-700)}
.why-row span:last-child{font:var(--type-body)}

.cta-band{padding-block:var(--space-8)}
.cta-row{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);flex-wrap:wrap}
.cta-row h2{margin:0}
.cta-row p{font:var(--type-body);color:var(--text-muted);margin:var(--space-2) 0 0}

/* ==========================================================================
   Services
   ========================================================================== */
.scope-toggle{display:flex;gap:var(--space-2);justify-content:center;margin-bottom:var(--space-6)}
.services-scope{position:relative}
#scope-inspection,#scope-cleaning{position:absolute;opacity:0;width:0;height:0}
.scope-toggle label[for="scope-cleaning"]{}
#scope-inspection:checked ~ .scope-toggle label[for="scope-inspection"],
#scope-cleaning:checked ~ .scope-toggle label[for="scope-cleaning"]{background:var(--blue-700);color:var(--white);border-color:var(--blue-700)}
.services-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-5);align-items:stretch}
.scope-panel{display:none}
#scope-inspection:checked ~ .services-grid .scope-panel-inspection,
#scope-cleaning:checked ~ .services-grid .scope-panel-cleaning{display:block}
.checklist-card{padding:0;overflow:hidden}
.checklist-head{padding:var(--space-4);background:var(--surface-raised);border-bottom:var(--border-w) solid var(--border-subtle);
  display:flex;justify-content:space-between;align-items:center}
.checklist-head span{font:var(--type-label);letter-spacing:var(--ls-wide);text-transform:uppercase;color:var(--blue-700)}
.side-stack{display:flex;flex-direction:column;gap:var(--space-4)}
.side-stack .card{flex:1;display:flex;flex-direction:column;justify-content:center}
.receive-list{list-style:none;display:grid;gap:var(--space-3);font:var(--type-small);margin-top:var(--space-3)}
.receive-list li{display:flex;gap:var(--space-2)}
.receive-list .icon{color:var(--teal-700);width:16px;height:16px}

/* ==========================================================================
   Gallery
   ========================================================================== */
.gallery-hero{position:relative;overflow:hidden}
.gallery-hero .frame{position:relative;aspect-ratio:1200/630;background:var(--dune-300)}
.gallery-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.gallery-hero .badge{position:absolute;bottom:var(--space-4)}
.gallery-hero .badge-before{left:var(--space-4)}
.gallery-hero .badge-after{right:var(--space-4)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:var(--space-5)}
.gallery-card{padding:0;overflow:hidden}
.gallery-placeholder{aspect-ratio:4/3;background:var(--dune-300);display:flex;align-items:center;justify-content:center;
  font:var(--type-small);color:var(--dune-600);text-align:center;padding:var(--space-4)}
.gallery-card-body{padding:var(--space-4)}
.gallery-card-body .title{font:var(--type-h3);color:var(--text-heading)}
.gallery-card-body .sub{font:var(--type-small);color:var(--text-muted)}

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-7);align-items:start}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.col-span-2{grid-column:1/-1}
.contact-checks{display:grid;gap:var(--space-3)}
.success{padding:var(--space-6) var(--space-4);text-align:center}
.success .icon{width:44px;height:44px;color:var(--teal-600);margin:0 auto}
.notice{border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);font:var(--type-small);margin-bottom:var(--space-4)}
.notice-error{background:var(--status-fail-soft);color:var(--status-fail)}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:900px){
  .hero-grid,.why-grid,.services-grid,.contact-grid{grid-template-columns:1fr}
  .grid-3,.gallery-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-about{grid-column:1/-1}
  .hero-figure,.hero-logo{order:-1}
  .contact-grid .side-stack{display:contents}
  .contact-grid .card-dune{order:1}
  .contact-grid .card-dark{order:2}
}
@media (max-width:760px){
  .nav-burger{display:inline-flex}
  .site-nav{position:absolute;top:100%;left:0;right:0;background:var(--white);border-bottom:var(--border-w) solid var(--border-subtle);
    flex-direction:column;align-items:stretch;padding:var(--space-4) var(--space-5);gap:var(--space-4);
    box-shadow:var(--shadow-md);display:none}
  .nav-toggle:checked ~ .site-nav{display:flex}
  .nav-links{flex-direction:column;align-items:flex-start;gap:var(--space-4)}
  .navbar{height:72px}
  .brand-mark{width:44px;height:44px}
}
@media (max-width:640px){
  .grid-3,.gallery-grid{grid-template-columns:1fr}
  .contact-form{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .hero h1{font-size:var(--text-4xl)}
  .cta-row{flex-direction:column;align-items:flex-start}
  .contact-heading h2{font-size:var(--text-3xl)}
  .contact-form button[type="submit"]{width:100%}
  .contact-checks .checkbox span:last-child{font-size:var(--text-sm);white-space:nowrap}
}