/* Sonrisa theme — ported from cowork-site-study/index-v2.html.
   Retheme = edit the :root tokens; nothing else references raw colours except the card art gradients. */
:root{
  --ivory:#faf7f0; --ivory-2:#f3eee2; --white:#fffdf8;
  --ink:#20261f; --ink-2:#55604f; --muted:#87917f;
  --tea:#14584a; --tea-deep:#0c3e34; --tea-soft:#e3ede8;
  --saffron:#c77e28; --saffron-soft:#f6ead7;
  --wa:#1faa53; --wa-deep:#12813b;
  --line:rgba(32,38,31,.12);
  --error:#b3261e;
}
*{box-sizing:border-box; margin:0}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion: no-preference){ html{scroll-behavior:smooth} }
[id]{scroll-margin-top:80px} /* sticky nav */
body{background:var(--ivory); color:var(--ink); font-family:"Mulish",system-ui,sans-serif; font-size:16.5px; line-height:1.65; -webkit-font-smoothing:antialiased; overflow-x:hidden}
h1,h2,h3,.serif{font-family:"Marcellus",Georgia,serif; font-weight:400; line-height:1.12; text-wrap:balance}
img{max-width:100%; height:auto}
a{color:var(--tea)}
:focus-visible{outline:3px solid var(--saffron); outline-offset:3px; border-radius:4px}
.wrap{max-width:1120px; margin:0 auto; padding:0 24px}
.eyebrow{font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; color:var(--saffron)}
.btn{display:inline-flex; align-items:center; gap:10px; border-radius:999px; padding:14px 26px; font-weight:700; font-size:.95rem; text-decoration:none; transition:transform .15s ease, box-shadow .15s ease; border:0; cursor:pointer; font-family:inherit; line-height:1.2}
.btn:hover{transform:translateY(-1px)}
.btn-wa{background:var(--wa); color:#fff; box-shadow:0 6px 18px rgba(31,170,83,.3)}
.btn-wa:hover{background:var(--wa-deep); color:#fff}
.btn-ghost{background:transparent; color:var(--tea-deep); border:1.5px solid var(--tea)}
.btn-tea{background:var(--tea); color:#fff}
.btn-tea:hover{background:var(--tea-deep); color:#fff}
.skip-link{position:absolute; left:-9999px; top:8px; z-index:100; background:var(--tea-deep); color:#fff; padding:10px 16px; border-radius:8px}
.skip-link:focus{left:8px}
.screen-reader-text{position:absolute!important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); white-space:nowrap}

/* nav */
.site-nav{position:sticky; top:0; z-index:50; background:rgba(250,247,240,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.nav-in{display:flex; align-items:center; justify-content:space-between; height:66px; gap:16px}
.logo{font-family:"Marcellus",serif; font-size:1.35rem; color:var(--tea-deep); text-decoration:none; letter-spacing:.02em; display:inline-flex; align-items:center; gap:10px; white-space:nowrap}
.logo span{color:var(--saffron)}
.logo img{height:44px; width:auto}
.nav-links{display:flex; gap:26px; align-items:center}
.nav-links ul{list-style:none; padding:0; margin:0; display:flex; gap:26px; align-items:center}
.nav-links a{text-decoration:none; color:var(--ink-2); font-weight:600; font-size:.9rem}
.nav-links a:hover, .nav-links .current-menu-item > a, .nav-links .current_page_item > a{color:var(--tea)}
.nav-links .btn{padding:9px 18px; font-size:.85rem; color:#fff}
.nav-toggle{display:none; background:transparent; border:1.5px solid var(--tea); color:var(--tea-deep); border-radius:999px; padding:8px 14px; font:inherit; font-weight:700; font-size:.85rem; cursor:pointer}
@media(max-width:960px){
  .nav-toggle{display:inline-flex; align-items:center; gap:8px}
  .nav-links{display:none; position:absolute; left:0; right:0; top:66px; background:var(--ivory); border-bottom:1px solid var(--line); padding:12px 24px 22px; flex-direction:column; align-items:stretch; gap:6px; box-shadow:0 18px 40px rgba(12,62,52,.12)}
  .nav-links ul{flex-direction:column; align-items:stretch; gap:0}
  .nav-links ul a{display:block; padding:12px 4px; border-bottom:1px solid var(--line); font-size:1rem}
  .nav-links .btn{justify-content:center; margin-top:12px}
  .nav-open .nav-links{display:flex}
}

/* hero */
.hero{position:relative; overflow:hidden; background:
  radial-gradient(1200px 600px at 85% -10%, #f9e7c9 0%, rgba(249,231,201,0) 60%),
  radial-gradient(900px 500px at -10% 110%, #dcebe4 0%, rgba(220,235,228,0) 60%),
  var(--ivory)}
.hero-in{display:grid; grid-template-columns:1.15fr .85fr; gap:40px; align-items:center; padding:84px 0 72px}
@media(max-width:900px){ .hero-in{grid-template-columns:1fr; padding:56px 0} .hero-art{max-width:380px; margin:0 auto} }
.hero h1{font-size:clamp(2.5rem,5.4vw,4rem); color:var(--tea-deep); margin:16px 0 18px}
.hero .sub{font-size:1.15rem; color:var(--ink-2); max-width:56ch; margin-bottom:30px}
.hero .sub b{color:var(--ink)}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap}
.hero-note{margin-top:16px; font-size:.85rem; color:var(--muted)}
.hero-art svg{width:100%; height:auto; display:block}

/* trust bar */
.trust{background:var(--tea-deep); color:#eaf3ee}
.trust-in{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; padding:22px 0}
.trust .t{display:flex; gap:12px; align-items:center; font-size:.9rem; font-weight:600}
.trust .t .big{font-family:"Marcellus",serif; font-size:1.5rem; color:#fff}
.trust .t small{display:block; font-weight:500; color:#b9d2c6; font-size:.78rem}

.sec{padding:84px 0}
@media(max-width:700px){ .sec{padding:56px 0} }
.sec-head{max-width:66ch; margin-bottom:40px}
.sec-head h2{font-size:clamp(1.8rem,3.4vw,2.5rem); color:var(--tea-deep); margin:12px 0 12px}
.sec-head p{color:var(--ink-2); font-size:1.05rem}
.alt{background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}

/* how it works */
.how{display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:22px}
.how .h-card{background:var(--white); border:1px solid var(--line); border-radius:16px; padding:30px 28px; position:relative}
.alt .how .h-card{background:var(--ivory)}
.how .n{font-family:"Marcellus",serif; font-size:2.6rem; color:var(--saffron); line-height:1}
.how h3{font-size:1.25rem; color:var(--tea-deep); margin:14px 0 8px}
.how p{font-size:.95rem; color:var(--ink-2)}

/* packages / tour cards */
.pk-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px}
.pk{background:var(--white); border:1px solid var(--line); border-radius:18px; overflow:hidden; display:flex; flex-direction:column; transition:transform .18s ease, box-shadow .18s ease}
.pk:hover{transform:translateY(-4px); box-shadow:0 16px 40px rgba(20,88,74,.12)}
.pk-art{height:170px; position:relative; display:flex; align-items:flex-end; padding:16px; background-size:cover; background-position:center; text-decoration:none}
.pk-art.has-img::before{content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(12,62,52,.55), rgba(12,62,52,0) 60%)}
.pk-art .badge{position:relative; background:rgba(255,253,248,.92); border-radius:999px; padding:5px 14px; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--tea-deep)}
.art-800{background-image:linear-gradient(135deg,#0c3e34 0%,#14584a 45%,#c77e28 120%)}
.art-classic{background-image:linear-gradient(135deg,#175646 0%,#3d8a6d 60%,#e9d8a6 120%)}
.art-week{background-image:linear-gradient(135deg,#1b4965 0%,#5fa8a0 70%,#f3eee2 130%)}
.art-honey{background-image:linear-gradient(135deg,#6d3a4e 0%,#c77e28 90%)}
.art-family{background-image:linear-gradient(135deg,#2e6b46 0%,#8fb96a 75%,#f2e8c9 130%)}
.art-rawana{background-image:linear-gradient(135deg,#7a3016 0%,#c77e28 70%,#f0d9a8 130%)}
.art-east{background-image:linear-gradient(135deg,#0e5e6f 0%,#39a0b5 65%,#f5e9cf 130%)}
.art-tea{background-image:linear-gradient(135deg,#274d24 0%,#5c8a4e 65%,#dfe8cf 130%)}
.art-day{background-image:linear-gradient(135deg,#4b4237 0%,#a3906f 75%,#f3eee2 130%)}
.pk-body{padding:22px 24px 24px; display:flex; flex-direction:column; gap:10px; flex:1}
.pk h3{font-size:1.3rem; color:var(--tea-deep)}
.pk h3 a{color:inherit; text-decoration:none}
.pk h3 a:hover{color:var(--tea)}
.pk .meta{font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.pk p{font-size:.93rem; color:var(--ink-2); flex:1}
.pk .foot{display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:12px; border-top:1px solid var(--line)}
.pk .price{font-family:"Marcellus",serif; font-size:1.15rem; color:var(--ink)}
.pk .price small{font-family:"Mulish",sans-serif; font-size:.72rem; color:var(--muted); display:block}
.pk .go{font-weight:800; font-size:.85rem; color:var(--tea); text-decoration:none; white-space:nowrap}
.price-note{margin-top:26px; font-size:.9rem; color:var(--ink-2); background:var(--saffron-soft); border-radius:12px; padding:16px 20px; max-width:820px}
.grid-more{margin-top:34px}

/* island loop */
.loop{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center}
@media(max-width:900px){ .loop{grid-template-columns:1fr} .loop-art{max-width:380px; margin:0 auto} }
.loop h2{font-size:clamp(1.8rem,3.2vw,2.4rem); color:var(--tea-deep); margin:12px 0}
.loop p{color:var(--ink-2); margin-bottom:14px}
.loop ul{list-style:none; padding:0; margin:18px 0 26px}
.loop li{padding:9px 0 9px 30px; position:relative; font-size:.95rem; color:var(--ink-2); border-bottom:1px dashed var(--line)}
.loop li::before{content:"✦"; position:absolute; left:4px; color:var(--saffron)}
.loop-art svg{width:100%; height:auto}

/* promises */
.prom{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:22px}
.prom .p-card{border-radius:16px; padding:28px 26px; background:var(--tea-soft)}
.prom .p-card:nth-child(2){background:var(--saffron-soft)}
.prom .p-card:nth-child(3){background:#e9e4f0}
.prom .p-card:nth-child(4){background:#f0e6dd}
.prom h3{font-size:1.15rem; color:var(--tea-deep); margin-bottom:8px}
.prom p{font-size:.92rem; color:var(--ink-2)}

/* planner — a small, quiet portrait beside the text; no hero treatment */
.subha{display:grid; grid-template-columns:160px 1fr; gap:36px; align-items:start; max-width:900px}
@media(max-width:600px){ .subha{grid-template-columns:1fr; gap:20px} }
.subha-ph{width:160px; height:160px; border-radius:50%; background:var(--ivory-2) center/cover no-repeat; border:1px solid var(--line); flex:none}
.subha-ph:not(.has-photo){display:grid; place-items:center; color:var(--muted); font-family:"Marcellus",serif; font-size:2.4rem}
.subha h2{font-size:clamp(1.6rem,2.8vw,2.1rem); color:var(--tea-deep); margin:12px 0 14px}
.subha p{color:var(--ink-2); margin-bottom:12px}
.subha .sig{font-family:"Marcellus",serif; font-size:1.2rem; color:var(--saffron); margin-top:8px}

/* reviews */
.revs{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px}
.rev{background:var(--white); border:1px solid var(--line); border-radius:16px; padding:28px}
.rev .stars{color:var(--saffron); letter-spacing:3px; margin-bottom:12px}
.rev p{font-size:.98rem; color:var(--ink); font-style:italic}
.rev .who{margin-top:14px; font-size:.8rem; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.06em}
.rev .who a{color:inherit}

/* faq */
.faq{max-width:820px}
.faq details{border-bottom:1px solid var(--line); padding:6px 0}
.faq summary{cursor:pointer; font-weight:700; font-size:1.02rem; padding:14px 0; color:var(--tea-deep); list-style:none; display:flex; justify-content:space-between; gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font-family:"Marcellus",serif; font-size:1.4rem; color:var(--saffron); flex:none}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 0 18px; color:var(--ink-2); font-size:.95rem; max-width:64ch}

/* enquiry */
.plan{background:var(--tea-deep); color:#eaf3ee; border-radius:24px; padding:52px; display:grid; grid-template-columns:1fr 1.1fr; gap:48px}
@media(max-width:900px){ .plan{grid-template-columns:1fr; padding:36px 26px} }
.plan h2{color:#fff; font-size:clamp(1.7rem,3vw,2.3rem); margin:10px 0 14px}
.plan .eyebrow{color:#e9c98f}
.plan p{color:#b9d2c6; font-size:.98rem}
.plan form{display:grid; gap:14px}
.plan label{font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#9fc2b2; display:block; margin-bottom:4px}
.plan input,.plan select,.plan textarea{width:100%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.08); color:#fff; border-radius:10px; padding:12px 14px; font-family:inherit; font-size:.95rem; color-scheme:dark}
.plan select option{color:var(--ink); background:#fff}
.plan input::placeholder,.plan textarea::placeholder{color:#8aab9b}
.plan .row{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media(max-width:520px){ .plan .row{grid-template-columns:1fr} }
.plan .actions{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.plan .btn-wa{justify-content:center}
.plan .btn-ghost{color:#e9c98f; border-color:#e9c98f}
.plan .alt-contact{font-size:.85rem; color:#9fc2b2; margin-top:6px}
.plan .alt-contact a{color:#e9c98f}
.plan .field-error{color:#f6c2bd; font-size:.82rem; margin-top:4px; display:block}
.plan .form-error{background:rgba(255,255,255,.1); border-left:3px solid #f6c2bd; padding:10px 14px; border-radius:8px; color:#fff}
.plan .req{color:#e9c98f}
.plan .hp{position:absolute; left:-9999px; top:-9999px}
div.sent{background:var(--tea-soft); border-radius:16px; padding:26px 28px; color:var(--tea-deep); margin:0 0 24px}
.plan div.sent{background:rgba(255,255,255,.1); color:#fff}
.plan div.sent p{color:#dcebe4}

/* footer */
.site-footer{background:#0a2f28; color:#9fc2b2; padding:48px 0 40px; font-size:.9rem}
.foot-in{display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:36px}
@media(max-width:800px){ .foot-in{grid-template-columns:1fr} }
.site-footer .logo{color:#fff; font-size:1.3rem}
.site-footer h4{color:#e9c98f; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:12px}
.site-footer a{color:#cfe2d8; text-decoration:none; display:block; padding:3px 0}
.site-footer a:hover{color:#fff}
.site-footer p a{display:inline}
.foot-bottom{border-top:1px solid rgba(255,255,255,.12); margin-top:36px; padding-top:20px; font-size:.78rem; color:#7da393}
.foot-bottom a{display:inline}

/* floating whatsapp */
.wa-float{position:fixed; right:22px; bottom:22px; z-index:60; background:var(--wa); color:#fff; border-radius:999px; padding:14px 22px; font-weight:800; text-decoration:none; box-shadow:0 10px 30px rgba(18,129,59,.4); display:flex; gap:10px; align-items:center}
.wa-float:hover{background:var(--wa-deep); color:#fff}
@media(max-width:600px){ .wa-float{right:14px; bottom:14px; padding:12px 16px; font-size:.9rem} }
@media (prefers-reduced-motion: no-preference){
  .fade{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease}
  .fade.in{opacity:1; transform:none}
}

/* ---------- inner pages (legacy content) ---------- */
.page-hero{background:
  radial-gradient(900px 400px at 90% -20%, #f9e7c9 0%, rgba(249,231,201,0) 60%),
  var(--ivory-2); border-bottom:1px solid var(--line)}
.page-hero .wrap{padding-top:52px; padding-bottom:44px}
.page-hero h1{font-size:clamp(2rem,4.2vw,3rem); color:var(--tea-deep); margin:12px 0 14px}
.page-hero .crumbs{font-size:.85rem; color:var(--muted)}
.page-hero .crumbs a{color:var(--ink-2); text-decoration:none}
.page-hero .crumbs a:hover{color:var(--tea)}
.page-hero .lead{color:var(--ink-2); max-width:62ch; font-size:1.05rem}
.page-hero .hero-ctas{margin-top:22px}
.content-wrap{padding:56px 0 24px}
.post-dates{max-width:78ch; margin:28px 0 0; font-size:.85rem; color:var(--muted)}
.entry{max-width:78ch; font-size:1.02rem}
.entry > *, .entry p, .entry ul, .entry ol, .entry table, .entry blockquote{margin-bottom:1.1em}
.entry h1,.entry h2,.entry h3,.entry h4{color:var(--tea-deep); margin-top:1.6em}
.entry h2{font-size:1.7rem} .entry h3{font-size:1.3rem} .entry h4{font-size:1.1rem; font-family:"Mulish",sans-serif; font-weight:800}
.entry p:empty{display:none}
.entry img{border-radius:12px; height:auto}
.entry img[align="left"],.entry .alignleft{float:left; margin:6px 22px 14px 0; max-width:48%}
.entry img[align="right"],.entry .alignright{float:right; margin:6px 0 14px 22px; max-width:48%}
.entry .aligncenter{display:block; margin:0 auto 1.1em}
.entry .wp-caption{max-width:100%}
.entry .wp-caption-text{font-size:.85rem; color:var(--muted); text-align:center}
.entry ul,.entry ol{padding-left:1.4em}
.entry li{margin-bottom:.4em}
.entry blockquote{border-left:3px solid var(--saffron); padding:4px 0 4px 20px; color:var(--ink-2); font-style:italic}
.entry a{text-decoration-thickness:1px; text-underline-offset:3px}
.entry hr{border:0; border-top:1px solid var(--line); margin:2em 0}
.entry table{border-collapse:collapse; width:100%; font-size:.92rem; display:block; overflow-x:auto; max-width:100%}
.entry table td,.entry table th{border:1px solid var(--line); padding:8px 10px; vertical-align:top; text-align:left}
.entry table th{background:var(--tea-soft); color:var(--tea-deep)}
.entry font{font-family:inherit!important; font-size:inherit!important; color:inherit!important}
.entry [style*="font-size"]{font-size:inherit!important}
.entry [style*="font-family"]{font-family:inherit!important}
/* Legacy inline colours were authored against the old white/dark boxes; About Us had a white-on-cream paragraph. Neutralise them. */
.entry [style*="color"]{color:inherit!important}
.entry [style*="background"]{background:transparent!important}
.entry font[color]{color:inherit!important}
.entry [style*="width"]{max-width:100%}
.entry iframe{max-width:100%}
.entry::after{content:""; display:block; clear:both}
.entry .gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px}
.entry .gallery .gallery-item{margin:0}
.entry .gallery img{width:100%; border:0}
.post-tail{display:flex; gap:14px; flex-wrap:wrap; align-items:center; margin:36px 0 0; padding-top:24px; border-top:1px solid var(--line)}
.post-tail .hint{font-size:.9rem; color:var(--ink-2)}

/* CF7 on the Contact page — the theme's success box is div.sent; CF7 adds .sent to <form>, so scope tightly */
.entry .wpcf7 form{display:grid; gap:14px; max-width:560px}
.entry .wpcf7 label{font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); display:block}
.entry .wpcf7 input:not([type=submit]),.entry .wpcf7 textarea,.entry .wpcf7 select{width:100%; border:1px solid var(--line); background:var(--white); border-radius:10px; padding:12px 14px; font:inherit; font-size:.95rem; margin-top:4px}
.entry .wpcf7 input[type=submit]{background:var(--tea); color:#fff; border:0; border-radius:999px; padding:14px 26px; font:inherit; font-weight:700; cursor:pointer}
.entry .wpcf7 input[type=submit]:hover{background:var(--tea-deep)}
.entry .wpcf7 p{margin:0}
.entry .wpcf7-not-valid-tip{color:var(--error); font-size:.85rem}
.entry .wpcf7-response-output{border-radius:10px; padding:12px 16px; margin:0}

/* archives / search / 404 */
.archive-head{margin-bottom:34px}
.pager{display:flex; justify-content:space-between; gap:14px; margin-top:34px; font-weight:700}
.pager a{text-decoration:none}
.search-form{display:flex; gap:10px; max-width:520px}
.search-form input[type=search]{flex:1; border:1px solid var(--line); background:var(--white); border-radius:999px; padding:12px 18px; font:inherit}
.search-form button{border-radius:999px}
.empty{padding:40px 0; color:var(--ink-2)}
