/* Coco De Tour — shared client design system
   Loaded last to unify legacy surfaces without changing product behaviour. */
:root{
  --coco-bg:#f7f3ec;
  --coco-surface:#fffdf9;
  --coco-surface-2:#efe9df;
  --coco-ink:#26231f;
  --coco-muted:#6e675f;
  --coco-line:#d9d1c6;
  --coco-accent:#80684f;
  --coco-accent-dark:#554433;
  --coco-dark:#18201e;
  --coco-radius:14px;
  --coco-radius-lg:18px;
  --coco-shadow:0 22px 60px rgba(48,38,28,.11);
  --coco-gutter:clamp(20px,4vw,52px);
  --coco-nav-space:calc(78px + env(safe-area-inset-top,0px));
}

html{background:var(--coco-bg)}
body.coco-body,
body.client-body,
body.scenario-body,
body.destination-page,
body.request-selection-page,
body.profile-page{
  background:var(--coco-bg)!important;
  color:var(--coco-ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

body:not(.editorial-home) .page-shell{
  min-height:100svh;
  padding:var(--coco-nav-space) var(--coco-gutter) max(72px,env(safe-area-inset-bottom))!important;
  background:var(--coco-bg)!important;
}

body:not(.editorial-home) .page-container{
  width:min(1180px,100%);
  max-width:1180px;
  margin:0 auto;
  padding:0;
}

body:not(.editorial-home) h1,
body:not(.editorial-home) h2,
body:not(.editorial-home) h3,
body:not(.editorial-home) h4{
  font-family:"Playfair Display",Georgia,serif;
  color:var(--coco-ink);
  font-weight:600;
  letter-spacing:-.025em;
  text-wrap:balance;
}

body:not(.editorial-home) h1{font-size:clamp(42px,6vw,76px);line-height:.98}
body:not(.editorial-home) h2{font-size:clamp(30px,4vw,48px);line-height:1.05}
body:not(.editorial-home) h3{font-size:clamp(22px,2.3vw,30px);line-height:1.14}

body:not(.editorial-home) p,
body:not(.editorial-home) li,
body:not(.editorial-home) dd{color:var(--coco-muted)}

body:not(.editorial-home) a{color:inherit}
body:not(.editorial-home) ::selection{background:#d8c3a8;color:#201d19}
body:not(.editorial-home) :focus-visible{outline:2px solid var(--coco-accent);outline-offset:3px}

/* Remove old decorative eyebrows globally on client surfaces. */
body:not(.editorial-home) .eyebrow,
body:not(.editorial-home) .directions-eyebrow,
body:not(.editorial-home) .section-kicker:not(.weather-kicker),
body:not(.editorial-home) .selection-kicker{
  display:none!important;
}

/* Core controls */
body:not(.editorial-home) button,
body:not(.editorial-home) .btn,
body:not(.editorial-home) .btn-hero,
body:not(.editorial-home) .btn-outline,
body:not(.editorial-home) .btn-details,
body:not(.editorial-home) .next-btn,
body:not(.editorial-home) .auth-submit,
body:not(.editorial-home) .auth-button,
body:not(.editorial-home) .fs-btn,
body:not(.editorial-home) .request-primary-action,
body:not(.editorial-home) .request-secondary-action{
  min-height:46px;
  border-radius:999px;
  font-weight:700;
  letter-spacing:.015em;
}

body:not(.editorial-home) .btn-primary,
body:not(.editorial-home) .btn-success,
body:not(.editorial-home) .btn-hero.solid,
body:not(.editorial-home) .next-btn,
body:not(.editorial-home) .auth-submit,
body:not(.editorial-home) .auth-button,
body:not(.editorial-home) .btn-details{
  border:1px solid var(--coco-dark)!important;
  background:var(--coco-dark)!important;
  color:#fff!important;
  box-shadow:none!important;
}

body:not(.editorial-home) .btn-secondary,
body:not(.editorial-home) .btn-outline,
body:not(.editorial-home) .hotel-option-secondary-action{
  border:1px solid var(--coco-line)!important;
  background:transparent!important;
  color:var(--coco-ink)!important;
  box-shadow:none!important;
}

body:not(.editorial-home) button:disabled,
body:not(.editorial-home) .btn:disabled,
body:not(.editorial-home) [aria-disabled="true"]{
  opacity:.45;
  cursor:not-allowed;
}

body:not(.editorial-home) input,
body:not(.editorial-home) select,
body:not(.editorial-home) textarea,
body:not(.editorial-home) .form-control{
  min-height:48px;
  border:1px solid var(--coco-line)!important;
  border-radius:12px!important;
  background:var(--coco-surface)!important;
  color:var(--coco-ink)!important;
  padding:12px 14px;
  box-shadow:none!important;
  font:inherit;
}

body:not(.editorial-home) textarea{min-height:120px}
body:not(.editorial-home) input::placeholder,
body:not(.editorial-home) textarea::placeholder{color:#8a8178!important;opacity:1}

/* Shared surfaces */
body:not(.editorial-home) .card,
body:not(.editorial-home) .section-shell,
body:not(.editorial-home) .stack-card,
body:not(.editorial-home) .params-card,
body:not(.editorial-home) .bubble-panel,
body:not(.editorial-home) .request-form-card,
body:not(.editorial-home) .request-trust-card,
body:not(.editorial-home) .request-agent-note,
body:not(.editorial-home) .selection-section,
body:not(.editorial-home) .fs-concierge,
body:not(.editorial-home) .fs-trip,
body:not(.editorial-home) .auth-card,
body:not(.editorial-home) .mockup-body{
  border:0!important;
  border-radius:var(--coco-radius)!important;
  background:var(--coco-surface)!important;
  box-shadow:var(--coco-shadow)!important;
  color:var(--coco-ink)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

body:not(.editorial-home) .pill,
body:not(.editorial-home) .soft-chip,
body:not(.editorial-home) .tour-chip,
body:not(.editorial-home) .destination-chip,
body:not(.editorial-home) .visa-pill{
  border:0!important;
  border-radius:999px!important;
  background:var(--coco-surface-2)!important;
  color:var(--coco-ink)!important;
  box-shadow:none!important;
}

/* Directions */
body.home-page:not(.editorial-home) .hero-viewport--directions{
  overflow:hidden;
  min-height:clamp(380px,58svh,620px);
  margin:0 0 72px;
  border-radius:var(--coco-radius-lg);
  box-shadow:var(--coco-shadow);
}
body.home-page:not(.editorial-home) .hero-viewport--directions .carousel-slide{
  min-height:clamp(380px,58svh,620px)!important;
  border-radius:var(--coco-radius-lg);
}
body.home-page:not(.editorial-home) .carousel-content{
  padding:clamp(28px,6vw,68px);
}
body.home-page:not(.editorial-home) .carousel-title{
  max-width:11ch;
  color:#fff!important;
  font-size:clamp(46px,7vw,88px);
  line-height:.96;
}
body.home-page:not(.editorial-home) .carousel-text{
  max-width:52ch;
  color:rgba(255,255,255,.82)!important;
  font-size:17px;
}
.directions-panel--directions-page{
  margin:0!important;
  padding:0!important;
  background:transparent!important;
}
.directions-header{margin-bottom:28px}
.directions-title{margin:0}
.directions-list--static{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px!important;
}
.direction-card{
  display:block!important;
  overflow:hidden;
  border:0!important;
  border-radius:var(--coco-radius)!important;
  background:var(--coco-surface)!important;
  box-shadow:var(--coco-shadow)!important;
  text-decoration:none!important;
}
.direction-card__media{
  display:block!important;
  aspect-ratio:4/3;
  background-image:var(--direction-image);
  background-position:center;
  background-size:cover;
}
.direction-card__info{padding:18px!important}
.direction-card__name{font-family:"Playfair Display",Georgia,serif;font-size:24px!important;line-height:1.1}
.direction-card__hint{margin-top:7px;color:var(--coco-muted)!important;font-size:14px!important}

/* Tour list/detail/cart */
.section-header{max-width:760px;margin:0 0 38px}
.section-header h2{margin:0 0 14px}
.section-header .lede{font-size:17px;line-height:1.6}
.tours-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px!important}
.tour-card{
  overflow:hidden;
  border:0!important;
  border-radius:var(--coco-radius)!important;
  background:var(--coco-surface)!important;
  box-shadow:var(--coco-shadow)!important;
}
.tour-image-container{aspect-ratio:4/3;overflow:hidden}
.tour-image-container img{width:100%;height:100%;object-fit:cover}
.tour-card-body{padding:20px!important}
.tour-card-body h3{margin:10px 0 8px}
.tour-card-body p{line-height:1.55}
.random-tour-widget{
  margin:34px 0 46px!important;
  padding:24px!important;
  border-radius:var(--coco-radius)!important;
  background:var(--coco-surface)!important;
  box-shadow:var(--coco-shadow)!important;
}
.card.mb-4{
  overflow:hidden;
  max-width:960px;
  margin:0 auto!important;
}
.card.mb-4 .image-container{aspect-ratio:16/9;overflow:hidden}
.card.mb-4 .tour-image{width:100%;height:100%;object-fit:cover}
.card.mb-4 .card-body{padding:clamp(24px,5vw,48px)}
.card.mb-4 .card-title{margin-bottom:18px}
.table{
  overflow:hidden;
  border-color:var(--coco-line)!important;
  border-radius:12px;
  background:var(--coco-surface);
  color:var(--coco-ink)!important;
}
.table>:not(caption)>*>*{padding:16px;border-color:var(--coco-line);background:transparent!important;color:var(--coco-ink)!important}

/* Destination details */
body.destination-page .page-shell{padding-top:var(--coco-nav-space)!important}
body.destination-page .destination-hero-viewport{
  z-index:auto!important;
  overflow:hidden;
  margin:0 0 32px!important;
  border-radius:var(--coco-radius-lg);
  box-shadow:var(--coco-shadow);
}
body.destination-page .destination-carousel-slide{height:clamp(320px,48svh,520px)!important}
body.destination-page .destination-carousel-title{color:#fff!important;font-size:clamp(48px,8vw,88px)!important}
body.destination-page .section-shell{
  width:100%!important;
  margin:20px 0 0!important;
  padding:clamp(22px,4vw,36px)!important;
}
body.destination-page .section-shell:first-of-type{
  margin-top:0!important;
  border-radius:var(--coco-radius)!important;
  box-shadow:var(--coco-shadow)!important;
}
body.destination-page .destination-card.modern,
body.destination-page .stack-card,
body.destination-page .season-card{background:transparent!important;box-shadow:none!important}
body.destination-page .visa-status,
body.destination-page .visa-tile,
body.destination-page .currency-tile,
body.destination-page .currency-converter{
  border:0!important;
  border-radius:12px!important;
  background:var(--coco-surface-2)!important;
}
body.destination-page .visa-status__emoji,
body.destination-page .visa-tile__icon{display:none!important}

/* Selection/request flow */
.request-form-page{padding:0!important}
.request-form-shell{max-width:1120px;margin:0 auto}
.request-form-layout{gap:40px!important}
.request-hero h1{margin:0 0 18px!important}
.request-hero p{font-size:17px!important;line-height:1.65!important}
.request-hero__eyebrow{display:none!important}
.request-form-card{padding:clamp(22px,4vw,38px)!important}
.form-section{border-color:var(--coco-line)!important}
.form-section h3{color:var(--coco-ink)!important}
.section-hint{color:var(--coco-muted)!important}
.selection-view-page{
  min-height:auto!important;
  padding:0!important;
  background:transparent!important;
}
.selection-view-shell{width:min(960px,100%)!important;margin:0 auto!important}
.selection-feed-header{margin-bottom:20px!important;color:var(--coco-ink)!important}
.hotel-option-item{
  overflow:hidden;
  margin-bottom:22px;
  border:0!important;
  border-radius:var(--coco-radius)!important;
  background:var(--coco-surface)!important;
  box-shadow:var(--coco-shadow)!important;
}
.selection-post-header{background:var(--coco-surface)!important;color:var(--coco-ink)!important}
.selection-post-author small,
.hotel-option-meta{color:var(--coco-muted)!important}
.hotel-option-trigger{background:var(--coco-surface)!important;color:var(--coco-ink)!important}
.hotel-option-title,
.hotel-option-price{color:var(--coco-ink)!important}
.hotel-option-content{background:var(--coco-surface)!important;color:var(--coco-ink)!important}
.hotel-option-details dt{color:var(--coco-muted)!important}
.hotel-option-details dd{color:var(--coco-ink)!important}

/* Scenario / vacation */
body.scenario-body .page-shell{padding-top:var(--coco-nav-space)!important}
body.scenario-body .scenario-content{max-width:1040px}
body.scenario-body .scenario-navbar{
  background:var(--nav-surface)!important;
  border-bottom:1px solid var(--nav-line)!important;
  box-shadow:0 10px 30px rgba(37,31,25,.06)!important;
}
body.scenario-body .scenario-navbar__logo-only{min-height:54px;display:flex;align-items:center;justify-content:center}
body.scenario-body .scenario-navbar .nav_logo{
  width:auto;height:auto;color:var(--coco-ink)!important;font-family:"Playfair Display",Georgia,serif;font-size:18px;letter-spacing:.04em;text-transform:none;
}
.glass-hero.compact,
.params-hero{
  margin:0 0 34px!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.glass-hero.compact .video-aura{display:none!important}
.glass-hero.compact .hero-copy{position:static!important;padding:0!important}
.glass-hero.compact .hero-copy h1,
.params-hero h1{margin:0 0 16px!important}
.glass-hero.compact .lede,
.params-hero .lede{max-width:60ch;color:var(--coco-muted)!important;font-size:17px!important;line-height:1.6}
.bubble-panel,
.params-card{padding:clamp(24px,5vw,42px)!important}
.scenario-bubble,
.budget-btn,
.tag-cloud button{
  min-height:44px!important;
  border:1px solid var(--coco-line)!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--coco-ink)!important;
  box-shadow:none!important;
}
.scenario-bubble:hover,
.budget-btn:hover,
.tag-cloud button:hover,
.budget-btn.active,
.tag-cloud button.active{
  border-color:var(--coco-dark)!important;
  background:var(--coco-dark)!important;
  color:#fff!important;
}

/* Auth */
body.auth-page .page-shell,
body:has(.auth-layout) .page-shell{
  padding-top:var(--coco-nav-space)!important;
}
.auth-layout{
  min-height:auto!important;
  padding:clamp(40px,8vw,92px) var(--coco-gutter)!important;
  place-items:center!important;
}
.auth-card,
.auth-layout>form,
.auth-layout:not(:has(.auth-card)){
  width:min(520px,100%);
}
.auth-card{padding:clamp(26px,5vw,42px)!important}
.auth-card::before,.auth-card::after{display:none!important}
.auth-title,.auth-layout h2{margin:0 0 12px;color:var(--coco-ink)!important}
.auth-subtitle,.auth-lede,.auth-helper,.auth-notice{color:var(--coco-muted)!important}
.auth-label{color:var(--coco-ink)!important}
.auth-input-wrapper{border:0!important;background:transparent!important;padding:0!important}
.auth-input{color:var(--coco-ink)!important}
.auth-errors{border:0!important;border-radius:10px!important;background:#f5e7e2!important;color:#7a3027!important}

/* Profile */
.profile-page .fs-profile,
.profile-page .account-shell{background:transparent!important}
.profile-page .fs-profile__hero{padding-top:0!important}
.profile-page .fs-profile__hero h1{font-size:clamp(44px,7vw,78px)!important}
.profile-page .fs-concierge,
.profile-page .fs-trip{border-radius:var(--coco-radius)!important}
.profile-page .fs-btn{border-radius:999px!important}
.profile-page .fs-btn--dark{background:var(--coco-dark)!important;color:#fff!important}

/* Success/empty utility pages */
.coco-simple-page{
  width:min(760px,100%);
  margin:0 auto;
  padding:clamp(28px,5vw,54px);
  border-radius:var(--coco-radius);
  background:var(--coco-surface);
  box-shadow:var(--coco-shadow);
}
.coco-simple-page h1,.coco-simple-page h2{margin-top:0}
.coco-simple-page__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}

/* Responsive */
@media(max-width:900px){
  .directions-list--static,.tours-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .request-form-layout{grid-template-columns:1fr!important}
}
@media(max-width:640px){
  :root{--coco-gutter:16px;--coco-nav-space:calc(66px + env(safe-area-inset-top,0px))}
  body:not(.editorial-home) .page-shell{padding-left:16px!important;padding-right:16px!important}
  .directions-list--static,.tours-grid{grid-template-columns:1fr}
  body.home-page:not(.editorial-home) .hero-viewport--directions{margin-bottom:48px;border-radius:12px}
  .direction-card__name{font-size:22px!important}
  .request-form-card,.bubble-panel,.params-card{padding:22px 18px!important}
  .visa-tiles{grid-template-columns:1fr!important}
  .visa-tile--wide{grid-column:auto!important}
  .coco-simple-page__actions{display:grid}
  .coco-simple-page__actions .btn{width:100%}
}
@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  body:not(.editorial-home) *{transition-duration:.001ms!important;animation-duration:.001ms!important}
}
