:root{
  --ink:#1a1a1a;
  --paper:#faf7f2;
  --sand:#e8dcc8;
  --sea:#0e7c86;
  --sea-deep:#0a5560;
  --palm:#1e3d2f;
}

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

html{scroll-behavior:smooth;}

body{
  margin:0;
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.6;
}

.container{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 1.25rem;
}

.small-caps{
  font-variant:small-caps;
  letter-spacing:.08em;
  font-size:.85rem;
  font-weight:600;
  color:var(--sea-deep);
}

a{color:var(--sea-deep);}

.script{
  font-family:'Dancing Script',cursive;
}

/* Header */
header.site-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--sand);
  background:var(--paper);
}

header.site-header .logo img{
  height:48px;
  display:block;
}

nav.main-nav{
  display:flex;
  align-items:center;
  gap:1.5rem;
  flex-wrap:wrap;
}

nav.main-nav a{
  text-decoration:none;
  color:var(--ink);
  font-size:.95rem;
}

.btn{
  display:inline-block;
  padding:.65rem 1.4rem;
  border-radius:2px;
  text-decoration:none;
  font-size:.9rem;
  border:1px solid var(--sea-deep);
  cursor:pointer;
}

.btn-primary{
  background:var(--sea);
  color:#fff;
  border-color:var(--sea);
}

.btn-outline{
  background:transparent;
  color:var(--sea-deep);
}

/* Hero */
.hero{
  background:linear-gradient(rgba(10,85,96,.55),rgba(10,85,96,.55)),url('../assets/img/hero.jpg') center/cover no-repeat;
  color:#fff;
  padding:6rem 1.25rem;
  text-align:center;
}

.hero h1{
  font-size:2.75rem;
  margin:0 0 .5rem;
}

.hero .tagline{
  font-size:2rem;
  margin:.25rem 0 1rem;
}

.hero .sub{
  max-width:640px;
  margin:0 auto 2rem;
  font-size:1.05rem;
}

.hero-ctas{
  display:flex;
  gap:1rem;
  justify-content:center;
  flex-wrap:wrap;
}

/* Sections */
section{
  padding:4rem 0;
  border-bottom:1px solid var(--sand);
}

section h2{
  text-align:center;
  margin-bottom:.5rem;
}

.steps{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:2rem;
  margin-top:2rem;
}

.step{
  text-align:center;
}

.step .step-num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2.5rem;
  height:2.5rem;
  border-radius:50%;
  background:var(--sand);
  color:var(--palm);
  font-weight:700;
  margin-bottom:.75rem;
}

.about-copy{
  max-width:760px;
  margin:1.5rem auto 0;
}

.team-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:2rem;
  margin-top:2rem;
}

.team-card{
  text-align:center;
}

.photo-box{
  width:100%;
  aspect-ratio:1;
  background:var(--sand);
  border-radius:4px;
  margin-bottom:.75rem;
}

.offices{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:2rem;
  margin-top:2rem;
}

.office-card{
  border:1px solid var(--sand);
  padding:1.5rem;
  border-radius:4px;
}

#route-map{
  margin-top:2rem;
  height:220px;
  background:var(--sand);
  border-radius:4px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--sea-deep);
}

/* Footer */
footer.site-footer{
  padding:2rem 1.25rem;
  text-align:center;
  font-size:.85rem;
  color:var(--ink);
}

footer.site-footer a{
  margin:0 .5rem;
}

.whatsapp-float{
  position:fixed;
  bottom:1.5rem;
  right:1.5rem;
  background:#25D366;
  width:56px;
  height:56px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
  z-index:100;
}

.whatsapp-float svg{
  width:28px;
  height:28px;
  fill:#fff;
}

/* Checkout / schedule / legal pages */
.page-header{
  padding:3rem 1.25rem 1rem;
  text-align:center;
}

.till-form{
  max-width:480px;
  margin:2rem auto;
  padding:2rem;
  border:1px solid var(--sand);
  border-radius:6px;
  background:#fff;
}

.till-form label{
  display:block;
  font-weight:600;
  margin:1rem 0 .35rem;
}

.till-form input{
  width:100%;
  padding:.6rem .75rem;
  border:1px solid var(--sand);
  border-radius:4px;
  font-family:inherit;
  font-size:1rem;
}

.till-form .btn{
  width:100%;
  margin-top:1.5rem;
}

.till-form button:disabled{
  opacity:.6;
  cursor:not-allowed;
}

.till-note{
  max-width:480px;
  margin:0 auto 2rem;
  text-align:center;
  font-size:.85rem;
  color:#555;
}

table.schedule-table{
  width:100%;
  border-collapse:collapse;
  margin:2rem 0;
}

table.schedule-table th,
table.schedule-table td{
  border:1px solid var(--sand);
  padding:.75rem 1rem;
  text-align:left;
}

table.schedule-table th{
  background:var(--sand);
}

.legal-content{
  max-width:760px;
  margin:0 auto;
  padding-bottom:3rem;
}

.legal-content h2{
  text-align:left;
  margin-top:2rem;
}
