@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;1,6..72,300;1,6..72,400&family=Public+Sans:wght@300;400;500;600&display=swap');

:root{
  --shell:#F5EEE4;
  --shell-2:#EAE0D2;
  --ink:#16302E;
  --muted:#4F6E6A;
  --line:#DCD2C4;
  --dusk:#123F3D;
  --dusk-2:#0C2B29;
  --dusk-muted:#8FB8B1;
  --accent:#2C948B;
  --accent-bright:#6DCBBD;
  --serif:'Newsreader',Georgia,serif;
  --sans:'Public Sans',-apple-system,Helvetica,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{overflow-x:hidden;}
body{background:var(--shell);color:var(--ink);font-family:var(--sans);font-weight:400;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1160px;margin:0 auto;padding:0 48px;}

h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.12;letter-spacing:-.01em;text-wrap:balance;}
.it{font-style:italic;}
.eyebrow{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);}

/* ---------- announcement + nav ---------- */
.announce{background:var(--dusk);color:#D6EAE6;font-size:12.5px;letter-spacing:.02em;text-align:center;padding:9px 20px;}
.announce b{color:var(--accent-bright);font-weight:500;}
.nav{display:flex;align-items:center;justify-content:space-between;padding:20px 48px;max-width:1160px;margin:0 auto;}
.nav.on-dark{color:var(--shell);}
.brand{font-family:var(--serif);font-style:italic;font-size:25px;letter-spacing:-.01em;}
.brand small{display:block;font-family:var(--sans);font-style:normal;font-size:9px;letter-spacing:.3em;text-transform:uppercase;opacity:.72;margin-top:1px;}
.navlinks{display:flex;gap:28px;font-size:13.5px;letter-spacing:.01em;}
.navlinks a{opacity:.85;padding-bottom:2px;}
.navlinks a.active{opacity:1;border-bottom:1px solid currentColor;}
.btn{display:inline-block;font-family:var(--sans);font-size:13px;font-weight:500;padding:11px 22px;border-radius:100px;background:var(--accent);color:var(--shell);letter-spacing:.01em;}
.btn.ghost{background:transparent;border:1px solid currentColor;}
.btn.dark{background:var(--dusk);color:var(--shell);}
.btn.sm{font-size:12px;padding:9px 18px;}
.nav-toggle{display:none;}
.nav-burger{display:none;}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;}
.hero.tall{height:640px;}
.hero.short{height:380px;}
.hero .bg{position:absolute;inset:0;background-size:cover;}
.hero .scrim{position:absolute;inset:0;}
.hero .inner{position:relative;height:100%;max-width:1160px;margin:0 auto;padding:0 48px;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:56px;color:var(--shell);}
.hero h1{font-size:74px;line-height:1.02;}
.hero.short h1{font-size:52px;}
.hero .kicker{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,238,228,.82);margin-bottom:18px;}
.hero p.lede{font-size:17px;font-weight:300;color:#E7DECF;max-width:46ch;margin-top:18px;}
.hero .cta{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap;}
.navover{position:absolute;top:0;left:0;right:0;z-index:5;}

/* ---------- sections ---------- */
section{padding:86px 0;}
section.tight{padding:60px 0;}
section.dusk{background:var(--dusk);color:var(--shell);}
section.shell2{background:var(--shell-2);}
.sechead{max-width:60ch;margin-bottom:44px;}
.sechead h2{font-size:42px;margin-top:12px;}
.sechead p{color:var(--muted);font-size:16.5px;margin-top:16px;font-weight:300;}
section.dusk .sechead p{color:var(--dusk-muted);}
section.dusk .eyebrow{color:var(--accent-bright);}

.wave{display:block;width:100%;height:36px;}

/* welcome split */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center;}
.split.rev{grid-template-columns:.95fr 1.05fr;}
.split .photo{border-radius:2px;overflow:hidden;}
.split .photo img{width:100%;height:100%;object-fit:cover;}
.split .photo.port{aspect-ratio:4/5;}
.split .photo.land{aspect-ratio:4/3;}
.prose p{font-size:16.5px;font-weight:300;color:#22413D;margin-bottom:16px;}
.prose p.first{font-size:19px;color:var(--ink);}
.sig{font-family:var(--serif);font-style:italic;font-size:22px;margin-top:22px;}

/* timetable */
.tt-day{margin-bottom:36px;}
.tt-day .dayhead{display:flex;align-items:baseline;gap:8px;padding-bottom:10px;border-bottom:1px solid var(--line);flex-wrap:wrap;}
.tt-day .dayhead h3{font-size:26px;}
.tt-day .dayhead .ven{font-size:12.5px;color:var(--muted);letter-spacing:.02em;display:inline-flex;align-items:center;gap:6px;}
.ttrow{display:grid;grid-template-columns:200px 1fr 150px 110px;gap:16px;align-items:center;padding:17px 0;border-bottom:1px solid var(--line);}
.ttrow .time{font-size:14.5px;font-variant-numeric:tabular-nums;letter-spacing:-.01em;white-space:nowrap;}
.ttrow .name{font-family:var(--serif);font-size:21px;}
.ttrow .name small{display:block;font-family:var(--sans);font-size:12.5px;color:var(--muted);margin-top:2px;}
.ttrow .place{font-size:13px;color:var(--muted);}
.ttrow .act{text-align:right;}
section.dusk .ttrow{border-color:#244C48;}
section.dusk .ttrow .place{color:var(--dusk-muted);}

/* maps pin links */
.maplink{display:inline-flex;color:inherit;opacity:.7;vertical-align:-1px;}
.maplink:hover{opacity:1;}

/* social icons */
.social-row{display:flex;gap:12px;margin-top:16px;}
.social-row a{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);color:var(--ink);}
.social-row a:hover{background:var(--ink);color:var(--shell);border-color:var(--ink);}
.social-row svg{width:16px;height:16px;}
footer .social-row a{border-color:#1D4A46;color:var(--dusk-muted);}
footer .social-row a:hover{background:var(--dusk-muted);color:var(--dusk-2);}

/* payment badges */
.pay-line{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;}
.paybadges{display:flex;gap:10px;flex-wrap:wrap;}
.paybadge{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--line);border-radius:100px;font-size:12.5px;background:#FFF;white-space:nowrap;}

/* cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.card{background:#FFF;border:1px solid var(--line);border-radius:3px;padding:30px 28px;}
.card .n{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--accent);}
.card h3{font-size:25px;margin:10px 0 12px;}
.card p{font-size:14.5px;color:var(--muted);font-weight:300;}
.card .meta{margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);}

/* price row */
.prices{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.prices div{background:var(--shell);padding:26px 24px;}
.prices b{display:block;font-family:var(--serif);font-size:40px;font-weight:400;letter-spacing:-.02em;}
.prices span{font-size:13px;color:var(--muted);display:block;margin-top:4px;}
.prices em{font-style:normal;font-size:12px;color:var(--muted);display:block;margin-top:8px;font-weight:300;}

/* quote */
.quote{max-width:44ch;}
.quote p{font-family:var(--serif);font-style:italic;font-size:27px;line-height:1.35;font-weight:300;}
.quote cite{display:block;font-family:var(--sans);font-style:normal;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:20px;}
section.dusk .quote cite{color:var(--dusk-muted);}
.quotes2{display:grid;grid-template-columns:1fr 1fr;gap:56px;}

/* forms */
.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:56px;}
.field{margin-bottom:18px;}
.field label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;}
.field .inp{border:1px solid var(--line);background:#FFF;border-radius:2px;padding:13px 14px;font-size:14px;color:#A9B8B4;}
.field .inp.area{height:104px;}
.contactlist dt{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:22px;}
.contactlist dd{font-size:17px;margin-top:5px;}
.contactlist dd small{font-size:13px;color:var(--muted);display:block;font-weight:300;}

/* footer */
footer{background:var(--dusk-2);color:var(--dusk-muted);padding:72px 0 34px;font-size:13.5px;font-weight:300;overflow-x:hidden;}
footer .fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:44px;}
footer h4{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--shell);margin-bottom:16px;}
footer .brand{color:var(--shell);font-size:27px;margin-bottom:12px;}
footer p{max-width:32ch;line-height:1.7;}
footer ul{list-style:none;}
footer li{margin-bottom:9px;}
footer li .maplink{margin-left:2px;}
footer .base{margin-top:52px;padding-top:22px;border-top:1px solid #1D4A46;display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#6E938C;flex-wrap:wrap;gap:8px;}
.wabtn{position:fixed;right:26px;bottom:26px;width:54px;height:54px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 22px -6px rgba(0,0,0,.4);z-index:20;}
.wabtn svg{width:29px;height:29px;fill:#fff;}
.tagline{font-family:var(--serif);font-style:italic;}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:980px){
  .wrap{padding:0 32px;}
  .nav{padding:18px 32px;}
  .hero .inner{padding:0 32px;}
  .hero h1{font-size:56px;}
  .sechead h2{font-size:34px;}
  footer .fgrid{grid-template-columns:1.2fr 1fr 1fr;gap:32px 28px;}
  footer .fgrid > div:nth-child(2){grid-column:1;}
  footer .fgrid > div:nth-child(3){grid-column:2;}
  footer .fgrid > div:nth-child(4){grid-column:3;}
}

@media (max-width:860px){
  section{padding:60px 0;}
  section.tight{padding:44px 0;}
  .split,.split.rev{grid-template-columns:1fr;gap:32px;}
  .split .photo{order:-1;}
  .split.rev .photo{order:-1;}
  .quotes2{grid-template-columns:1fr;gap:36px;}
  .formgrid{grid-template-columns:1fr;gap:40px;}
  .cards{grid-template-columns:1fr;}
  .prices{grid-template-columns:1fr 1fr;}
  footer .fgrid{grid-template-columns:1fr 1fr;gap:32px 28px;}
  footer .fgrid > div:nth-child(2),footer .fgrid > div:nth-child(3),footer .fgrid > div:nth-child(4){grid-column:auto;}
}

@media (max-width:700px){
  /* hamburger nav */
  .nav{flex-wrap:wrap;row-gap:0;}
  .nav-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;width:30px;height:26px;cursor:pointer;order:2;margin-left:12px;}
  .nav-burger span{display:block;height:2px;width:100%;background:currentColor;border-radius:2px;}
  .nav .btn{order:3;font-size:12px;padding:9px 16px;}
  .navlinks{order:4;flex-basis:100%;flex-direction:column;gap:0;max-height:0;overflow:hidden;transition:max-height .28s ease;width:100%;}
  .nav-toggle:checked ~ .navlinks{max-height:400px;margin-top:14px;background:var(--dusk-2);border-radius:10px;padding:6px 18px 14px;box-shadow:0 16px 32px -12px rgba(0,0,0,.5);}
  .navlinks a{padding:12px 0;border-bottom:1px solid rgba(245,238,228,.14);}
  .navlinks a.active{border-bottom:1px solid rgba(245,238,228,.14);}
  .brand{order:1;}

  .hero.tall{height:560px;}
  .hero.short{height:340px;}
  .hero h1{font-size:38px;}
  .hero.short h1{font-size:32px;}
  .hero .kicker{font-size:10px;}
  .hero p.lede{font-size:15px;}
  .hero .cta .btn{font-size:12.5px;padding:10px 18px;}

  .sechead h2{font-size:27px;}
  .sechead p{font-size:15px;}
  .prose p{font-size:15px;}
  .prose p.first{font-size:17px;}

  .tt-day .dayhead h3{font-size:21px;}
  .ttrow{grid-template-columns:1fr auto;row-gap:5px;padding:14px 0;}
  .ttrow .time{grid-column:1;font-size:13.5px;order:1;}
  .ttrow .act{grid-column:2;order:2;}
  .ttrow .name{grid-column:1/-1;order:3;font-size:18px;}
  .ttrow .place{grid-column:1/-1;order:4;font-size:12px;}

  .prices{grid-template-columns:1fr 1fr;}
  .prices b{font-size:30px;}

  .quote p{font-size:21px;}

  .pay-line{flex-direction:column;align-items:flex-start;}

  footer{padding:52px 0 26px;}
  footer .fgrid{grid-template-columns:1fr;gap:30px;}
  footer .base{flex-direction:column;align-items:flex-start;}

  .wabtn{width:48px;height:48px;right:16px;bottom:16px;}
  .wabtn svg{width:24px;height:24px;}
}

@media (max-width:460px){
  .wrap{padding:0 20px;}
  .nav{padding:16px 20px;}
  .hero .inner{padding:0 20px;padding-bottom:36px;}
  .hero h1{font-size:32px;}
}
