/* ==========================================================================
   The AML Co. — site styles
   Palette and type follow Section 10 (Design Direction) of
   The_AML_Co_Website_Copy_and_Build_Guide_V3_FINAL.docx
   Colours sampled from "Alice logo.png". Contrast checked against WCAG 2.2 AA.
   ========================================================================== */

/* --------------------------------------------------------- Typeface -------
   Plus Jakarta Sans, served from this folder. Nothing is fetched from Google,
   so no visitor's IP address leaves the site and the pages work offline.
   Latin subset only — it covers every character used on this site. Licence:
   SIL Open Font License 1.1, full text in assets/fonts/.
   -------------------------------------------------------------------------- */

@font-face{
  font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:400; font-display:swap;
  src:url('fonts/plus-jakarta-sans-latin-400-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans'; font-style:italic; font-weight:400; font-display:swap;
  src:url('fonts/plus-jakarta-sans-latin-400-italic.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:500; font-display:swap;
  src:url('fonts/plus-jakarta-sans-latin-500-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:600; font-display:swap;
  src:url('fonts/plus-jakarta-sans-latin-600-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Plus Jakarta Sans'; font-style:normal; font-weight:700; font-display:swap;
  src:url('fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2');
}

:root{
  /* Base */
  --cream:        #FDF9F2;   /* page background */
  --cream-deep:   #F7F0E3;   /* alternating band */
  --white:        #FFFFFF;

  /* Ink */
  --ink:          #3B2C39;   /* body text            12.5:1 on cream */
  --ink-muted:    #6A5A66;   /* secondary text        6.1:1 on cream */

  /* Brand */
  --plum:         #5A2A4B;   /* headings             10.7:1 on cream */
  --plum-deep:    #4A2140;   /* dark bands           12.6:1 with cream text */
  --plum-tint:    #F6EEF3;
  --gold:         #B08A2E;   /* large text / rules    3.1:1 — never body text */
  --gold-text:    #7A5E1E;   /* small labels        >=5.3:1 on every band */
  --gold-light:   #D9B863;   /* on plum               6.9:1 */
  --gold-tint:    #F7EFDD;

  /* Lines */
  --line:         #E3D5BE;
  --line-soft:    #EDE4D5;

  /* Shape */
  --radius:       14px;
  --radius-lg:    24px;
  --shadow:       0 1px 2px rgba(74,33,64,.05), 0 10px 30px rgba(74,33,64,.06);

  /* Rhythm */
  --wrap:         1120px;
  --prose:        62ch;
  --section-y:    clamp(3.25rem, 7vw, 6.5rem);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size:clamp(1.0625rem, .35vw + 1rem, 1.1875rem);
  line-height:1.7;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }

/* --------------------------------------------------------- Type ---------- */

h1,h2,h3,h4{
  color:var(--plum);
  font-weight:600;
  line-height:1.18;
  letter-spacing:-.015em;
  margin:0 0 .6em;
  text-wrap:balance;
}
h1{ font-size:clamp(2.1rem, 4.6vw, 3.35rem); }
h2{ font-size:clamp(1.65rem, 3.1vw, 2.35rem); }
h3{ font-size:clamp(1.2rem, 1.6vw, 1.4rem); }
h4{ font-size:1.0625rem; }

p{ margin:0 0 1.15em; max-width:var(--prose); }
p:last-child{ margin-bottom:0; }

a{ color:var(--plum); text-underline-offset:.18em; text-decoration-thickness:1px; }
a:hover{ color:var(--gold-text); }

strong{ font-weight:600; color:var(--plum); }

.lede{
  font-size:clamp(1.15rem, 1.1vw + .9rem, 1.4rem);
  line-height:1.6;
  color:var(--ink);
  max-width:56ch;
}

.eyebrow{
  display:block;
  font-size:.8125rem;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--gold-text);
  margin:0 0 .9rem;
}

.small{ font-size:.9375rem; color:var(--ink-muted); }

/* ------------------------------------------------------- Layout ---------- */

.wrap{ width:min(100% - 2.5rem, var(--wrap)); margin-inline:auto; }
@media (max-width:480px){ .wrap{ width:calc(100% - 2rem); } }

section{ padding-block:var(--section-y); }
.band-cream{ background:var(--cream-deep); }
.band-plum{ background:var(--plum-deep); color:var(--cream); }
.band-plum h1,.band-plum h2,.band-plum h3{ color:var(--cream); }
.band-plum a{ color:var(--gold-light); }
.band-gold{ background:var(--gold-tint); }

.center{ text-align:center; }
.center p,.center .lede{ margin-inline:auto; }

.rule{
  width:56px; height:3px; border:0; border-radius:2px;
  background:var(--gold); margin:0 0 1.6rem;
}
.center .rule{ margin-inline:auto; }

/* ------------------------------------------------------ Buttons ---------- */

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  min-height:48px; padding:.75rem 1.6rem;
  border-radius:999px; border:2px solid transparent;
  font-size:1rem; font-weight:600; letter-spacing:.005em;
  text-decoration:none; cursor:pointer;
  transition:background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.btn-primary{ background:var(--plum-deep); color:var(--cream); border-color:var(--plum-deep); }
.btn-primary:hover{ background:var(--plum); border-color:var(--plum); color:var(--cream); transform:translateY(-1px); }
.btn-secondary{ background:transparent; color:var(--plum); border-color:var(--plum); }
.btn-secondary:hover{ background:var(--plum); color:var(--cream); }
.band-plum .btn-primary{ background:var(--gold-light); color:#33162C; border-color:var(--gold-light); }
.band-plum .btn-primary:hover{ background:#E8CD86; border-color:#E8CD86; color:#33162C; }
.band-plum .btn-secondary{ color:var(--cream); border-color:var(--cream); }
.band-plum .btn-secondary:hover{ background:var(--cream); color:var(--plum-deep); }

.btn-row{ display:flex; flex-wrap:wrap; gap:.85rem; margin-top:1.75rem; }
.center .btn-row{ justify-content:center; }

/* Focus — visible on every surface (WCAG 2.4.7) */
a:focus-visible,.btn:focus-visible,button:focus-visible,summary:focus-visible{
  outline:3px solid var(--gold-text);
  outline-offset:3px;
  border-radius:6px;
}
.band-plum a:focus-visible,.band-plum .btn:focus-visible{ outline-color:var(--gold-light); }

.skip{
  position:absolute; left:-9999px; top:0;
  background:var(--plum-deep); color:var(--cream);
  padding:.85rem 1.25rem; border-radius:0 0 var(--radius) 0;
  font-weight:600; text-decoration:none; z-index:100;
}
.skip:focus{ left:0; }

/* ------------------------------------------------------- Header ---------- */

.site-header{
  background:var(--cream);
  border-bottom:1px solid var(--line-soft);
  position:sticky; top:0; z-index:50;
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem; padding-block:1rem;
}
.brand{ display:block; flex:0 0 auto; }
.brand img{ width:186px; height:auto; }
@media (max-width:600px){ .brand img{ width:150px; } }

.nav-toggle{
  display:none;
  align-items:center; gap:.5rem;
  min-height:44px; padding:.5rem .95rem;
  background:transparent; color:var(--plum);
  border:1.5px solid var(--line); border-radius:999px;
  font:inherit; font-size:.9375rem; font-weight:600; cursor:pointer;
}
.nav-toggle svg{ width:18px; height:18px; }

#primary-nav ul{
  display:flex; flex-wrap:wrap; align-items:center; gap:.35rem;
  list-style:none; margin:0; padding:0;
}
#primary-nav a{
  display:block; padding:.55rem .8rem;
  border-radius:999px;
  font-size:.9375rem; font-weight:500;
  color:var(--ink); text-decoration:none;
}
#primary-nav a:hover{ background:var(--gold-tint); color:var(--plum); }
#primary-nav a[aria-current="page"]{
  color:var(--plum); font-weight:700;
  box-shadow:inset 0 -2px 0 var(--gold);
  border-radius:0;
}


/* Contact sub-navigation — WAI-ARIA disclosure navigation pattern.
   The Contact item IS the button: there is no landing page behind it, so the
   four enquiry pages are the only destinations. Works the same at every width. */
.has-sub{ position:relative; }
.sub-toggle{
  display:flex; align-items:center; gap:.3rem;
  padding:.55rem .8rem;
  background:transparent; color:var(--ink);
  border:0; border-radius:999px; cursor:pointer;
  font:inherit; font-size:.9375rem; font-weight:500;
  min-height:24px;
}
.sub-toggle svg{ width:14px; height:14px; transition:transform .15s ease; }
.sub-toggle:hover{ background:var(--gold-tint); color:var(--plum); }
.has-sub.open .sub-toggle svg{ transform:rotate(180deg); }
.has-sub.is-current > .sub-toggle{
  color:var(--plum); font-weight:700;
  box-shadow:inset 0 -2px 0 var(--gold);
  border-radius:0;
}

/* #primary-nav ul{display:flex} outranks a bare .subnav rule, so these are
   written at the same specificity or higher. Without that the panel is
   permanently open. */
#primary-nav .subnav{
  display:none;
  position:absolute; top:calc(100% + .45rem); right:0;
  min-width:15rem;
  flex-direction:column; flex-wrap:nowrap; align-items:stretch; gap:0;
  list-style:none; margin:0; padding:.4rem;
  background:var(--white); border:1px solid var(--line-soft);
  border-radius:12px; box-shadow:var(--shadow);
  z-index:60;
}
#primary-nav .has-sub.open .subnav{ display:block; }
#primary-nav .subnav a{ padding:.6rem .75rem; border-radius:8px; white-space:nowrap; }

@media (max-width:900px){
  .nav-toggle{ display:inline-flex; }
  .has-sub{ display:block; }
  .sub-toggle{ width:100%; justify-content:space-between;
    padding:.85rem .25rem; border-bottom:1px solid var(--line-soft);
    border-radius:0; font-size:1.0625rem; }
  .has-sub.is-current > .sub-toggle{ box-shadow:none; color:var(--plum); }
  #primary-nav .subnav{
    position:static; min-width:0;
    background:transparent; border:0; border-radius:0; box-shadow:none;
    padding:0 0 0 1rem;
  }
  #primary-nav .subnav a{
    padding:.7rem .25rem; border-radius:0;
    border-bottom:1px solid var(--line-soft);
    font-size:1rem; color:var(--ink-muted);
  }
  #primary-nav .subnav li:last-child a{ border-bottom:0; }

  #primary-nav{
    display:none;
    position:absolute; left:0; right:0; top:100%;
    background:var(--cream);
    border-bottom:1px solid var(--line-soft);
    box-shadow:var(--shadow);
    padding:.5rem 0 1rem;
  }
  #primary-nav.open{ display:block; }
  #primary-nav ul{ flex-direction:column; align-items:stretch; gap:0; width:min(100% - 2.5rem,var(--wrap)); margin-inline:auto; }
  #primary-nav a{ padding:.85rem .25rem; border-bottom:1px solid var(--line-soft); border-radius:0; font-size:1.0625rem; }
  #primary-nav li:last-child a{ border-bottom:0; }
  #primary-nav a[aria-current="page"]{ box-shadow:none; color:var(--plum); }
}

/* --------------------------------------------------------- Hero ---------- */

.hero{
  position:relative; overflow:hidden;
  padding-block:clamp(3.5rem,8vw,7rem);
  background:
    radial-gradient(120% 80% at 82% -10%, rgba(217,184,99,.20), transparent 62%),
    radial-gradient(90% 70% at 5% 110%, rgba(90,42,75,.07), transparent 60%),
    var(--cream);
}
.hero-logo{ width:min(340px,66vw); margin:0 0 1.85rem; }
.center .hero-logo{ margin-inline:auto; }
.hero h1{ margin-bottom:.5em; }

.page-hero{
  padding-block:clamp(2.75rem,6vw,4.75rem);
  background:
    radial-gradient(100% 90% at 90% 0%, rgba(217,184,99,.18), transparent 60%),
    var(--cream);
  border-bottom:1px solid var(--line-soft);
}
.page-hero h1{ margin-bottom:.35em; }

/* -------------------------------------------------------- Cards ---------- */

.grid{ display:grid; gap:1.5rem; }
.grid-2{ grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); }
.grid-3{ grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr)); }
.grid-3-wide{ grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr)); }
.grid-4{ grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr)); }

/* Exactly two columns from 640px up, one below. auto-fit would give three
   at desktop width, which leaves a four-card set as 3 + 1. */
.grid-2x2{ grid-template-columns:1fr; }
@media (min-width:640px){ .grid-2x2{ grid-template-columns:1fr 1fr; } }
.grid-2x2 .card{ display:flex; flex-direction:column; }
.grid-2x2 .card .btn-row{ margin-top:auto; }

/* Portrait on the About page. */
.portrait{ margin:0; }
.portrait img{
  display:block; width:100%; height:auto;
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
}

.card{
  background:var(--white);
  border:1px solid var(--line-soft);
  border-radius:var(--radius-lg);
  padding:clamp(1.5rem,3vw,2.4rem);
  box-shadow:var(--shadow);
  display:flex; flex-direction:column;
}
.card > .btn-row{ margin-top:auto; padding-top:1.5rem; }
.card p{ max-width:none; }

.card-adult{ background:linear-gradient(180deg,var(--plum-tint),var(--white) 62%); border-color:#EADCE5; }
.card-child{ background:linear-gradient(180deg,var(--gold-tint),var(--white) 62%); border-color:#EFE1C4; }

.card-flat{
  background:transparent; border:0; box-shadow:none; padding:0;
}

.tile{
  background:var(--white);
  border:1px solid var(--line-soft);
  border-radius:var(--radius);
  padding:1.35rem 1.4rem;
}
.tile h3{ font-size:1.0625rem; margin-bottom:.35em; }
.tile p{ margin:0; font-size:.9688rem; color:var(--ink-muted); max-width:none; }

/* ------------------------------------------------------- Quotes ---------- */

.pullquote{
  border-left:4px solid var(--gold);
  padding:.35rem 0 .35rem 1.5rem;
  margin:2rem 0;
  font-size:clamp(1.3rem,2.4vw,1.8rem);
  line-height:1.4;
  font-weight:500;
  color:var(--plum);
  letter-spacing:-.01em;
  max-width:24ch;
}
.band-plum .pullquote{ color:var(--cream); border-color:var(--gold-light); }

.statement{
  font-size:clamp(1.5rem,3.6vw,2.6rem);
  line-height:1.28;
  font-weight:500;
  letter-spacing:-.02em;
  max-width:34ch;
  text-wrap:balance;
}

/* -------------------------------------------------------- Lists ---------- */

.ticks{ list-style:none; margin:0 0 1.25em; padding:0; max-width:var(--prose); }
.ticks li{
  position:relative; padding:.3rem 0 .3rem 1.9rem;
}
.ticks li::before{
  content:""; position:absolute; left:.15rem; top:1.05em;
  width:9px; height:9px; border-radius:50%;
  background:var(--gold);
}
.band-plum .ticks li::before{ background:var(--gold-light); }

.numbered{ counter-reset:step; list-style:none; margin:0; padding:0; }
.numbered li{
  counter-increment:step;
  position:relative; padding:.15rem 0 .15rem 3rem; margin-bottom:.9rem;
}
.numbered li::before{
  content:counter(step);
  position:absolute; left:0; top:.1em;
  width:2rem; height:2rem; border-radius:50%;
  display:grid; place-items:center;
  background:var(--gold-tint); color:var(--gold-text);
  font-size:.875rem; font-weight:700;
  border:1px solid #EBDCBC;
}

/* ------------------------------------------------------ Journey ---------- */

.flow{
  display:flex; flex-wrap:wrap; gap:.55rem; align-items:center;
  margin:0; padding:0; list-style:none;
}
.flow li{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.8125rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--plum);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:999px;
  padding:.42rem .85rem;
}
.flow li::after{
  content:"→"; color:var(--gold); font-weight:400; letter-spacing:0;
  margin-left:.15rem;
}
.flow li:last-child::after{ content:none; }

/* --------------------------------------------------------- Info ---------- */

.note{
  background:var(--white);
  border:1px solid var(--line-soft);
  border-left:4px solid var(--plum);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:1.35rem 1.5rem;
  margin:2rem 0 0;
}
.note h3{ font-size:1.0625rem; margin-bottom:.4em; }
.note p{ font-size:.9688rem; color:var(--ink-muted); }

.price{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:.75rem;
  font-size:clamp(1.5rem,2.6vw,2rem); font-weight:700; color:var(--plum);
  letter-spacing:-.02em; margin:0 0 .5rem;
}
.price span{ font-size:1rem; font-weight:500; color:var(--ink-muted); letter-spacing:0; }

/* ----------------------------------------------------------- FAQ --------- */

.faq{ max-width:var(--prose); }
.faq details{
  border-bottom:1px solid var(--line-soft);
  padding:.35rem 0;
}
.faq summary{
  cursor:pointer; list-style:none;
  padding:1.05rem 2.5rem 1.05rem 0;
  position:relative;
  font-weight:600; color:var(--plum); font-size:1.0625rem;
  line-height:1.4;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:"+"; position:absolute; right:.4rem; top:.85rem;
  font-size:1.5rem; font-weight:400; color:var(--gold-text); line-height:1;
}
.faq details[open] summary::after{ content:"–"; }
.faq details > *:not(summary){ margin-bottom:1.15rem; }

/* ------------------------------------------------- To-confirm flag ------- */
/* Draft markers. Search the HTML for "tbc" to find and remove every one. */

.tbc{
  display:inline-block;
  background:#FBEFD4; color:#7A5310;
  border:1px dashed #C9A227; border-radius:6px;
  padding:.05em .5em; margin:0 .1em;
  font-size:.875em; font-weight:600; letter-spacing:.01em;
  white-space:normal;
}

.draft-banner{
  background:var(--plum-deep); color:var(--cream);
  padding:.85rem 0; font-size:.9375rem;
}
.draft-banner p{ margin:0; max-width:none; }
.draft-banner strong{ color:var(--gold-light); }
.draft-banner-alt{ background:#6B5217; }
.draft-banner-alt strong{ color:#FDF9F2; }

/* ------------------------------------------------------- Footer ---------- */

.site-footer{
  background:var(--plum-deep); color:#E7D9E2;
  padding-block:clamp(2.75rem,5vw,4rem);
  font-size:.9688rem;
}
.site-footer h2{ color:var(--cream); font-size:1.35rem; margin-bottom:.3em; }
.site-footer p{ max-width:46ch; color:#E7D9E2; }
.site-footer a{ color:var(--gold-light); }
.footer-grid{
  display:grid; gap:2rem 3rem;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
}
.footer-tag{ color:var(--gold-light); font-weight:500; }
.footer-links{ list-style:none; margin:0; padding:0; }
.footer-links li{ margin-bottom:.25rem; }
.footer-links a{ display:inline-block; padding:.3rem 0; min-height:24px; }
.footer-bottom{
  margin-top:2.5rem; padding-top:1.5rem;
  border-top:1px solid rgba(231,217,226,.22);
  display:flex; flex-wrap:wrap; gap:.75rem 1.5rem; justify-content:space-between;
  font-size:.875rem; color:#CDB9C6;
}
.footer-bottom p{ margin:0; color:#CDB9C6; }

/* ------------------------------------------------------ Utility ---------- */

.stack-lg > * + *{ margin-top:2.5rem; }
.mt-0{ margin-top:0; }
.maxw{ max-width:var(--prose); }
.visually-hidden{
  position:absolute; width:1px; height:1px; margin:-1px;
  clip-path:inset(50%); overflow:hidden; white-space:nowrap;
}

@media print{
  .site-header,.site-footer,.btn-row,.skip,.draft-banner{ display:none; }
  body{ background:#fff; }
}