/*
Theme Name: Dapur Serona
Theme URI: https://dapurserona.com
Description: Custom theme for Dapur Serona (Kerepek Bawang Tok Mak). Content is managed with Codeideal Open Fields through the Dapur Serona Core plugin.
Author: Dapur Serona
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: dapur-serona
*/

/* ==========================================================================
   Fonts (self-hosted, same families and weights as the original design)
   ========================================================================== */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600 900;font-display:swap;src:url(assets/fonts/fraunces-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600 900;font-display:swap;src:url(assets/fonts/fraunces-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url(assets/fonts/manrope-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:400 800;font-display:swap;src:url(assets/fonts/manrope-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ==========================================================================
   Tokens and base
   ========================================================================== */
:root{
  --ink:#23160F; --cream:#FBEFDC; --orange:#D9500F; --amber:#F7A600; --brick:#C4430A;
  --brown:#6B4A15; --sand:#C7AB88; --dots:#E9CFA6; --line:#D9A96F; --umber:#4A3527;
  --serif:'Fraunces',Georgia,serif; --sans:'Manrope',system-ui,sans-serif;
  --ease:cubic-bezier(0.45,0,0.15,1);
  --stripes:repeating-linear-gradient(45deg,#F5E2C4,#F5E2C4 8px,#EFD7B2 8px,#EFD7B2 16px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--orange);text-decoration:none}
a:hover{color:#C81E2A}
img{border:0}
button{font:inherit}
.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);border:0}
.hl{color:var(--orange)}
@keyframes dsMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Section headings (h2) share one style */
.ds-h2{font-family:var(--serif);font-weight:800;font-size:clamp(40px,5.2vw,54px);line-height:1.02;letter-spacing:-0.02em;text-align:left;margin:0 0 40px;max-width:22ch;text-wrap:balance}
@media (max-width:1023px){.ds-h2{text-align:center;margin-left:auto;margin-right:auto}}
.ds-wrap{max-width:1200px;margin:0 auto;padding:64px 16px}

/* ==========================================================================
   Announcement bar
   ========================================================================== */
.ds-bar{background:var(--ink);color:var(--amber);font-family:var(--sans);font-size:16px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;padding:8px 16px;overflow:hidden}
.ds-bar__track{display:flex;transition:transform 640ms var(--ease)}
.ds-bar__track.is-snap{transition:none}
.ds-bar__msg{flex:0 0 100%;text-align:center}

/* ==========================================================================
   Header
   ========================================================================== */
.ds-sticky{position:sticky;top:0;z-index:60}
html{scroll-padding-top:var(--ds-bar-h,0px)}
.ds-header{position:relative;background:var(--cream);border-bottom:3px solid var(--ink)}
.ds-header__in{max-width:1200px;margin:0 auto;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.ds-burger{display:none;flex:0 0 auto;flex-direction:column;justify-content:center;gap:8px;width:48px;height:48px;padding:0 16px;background:var(--amber);border:2.5px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);cursor:pointer}
.ds-burger span{display:block;height:3px;background:var(--ink);border-radius:2px}
.ds-brand{display:flex;align-items:center;gap:8px;flex-shrink:0}
.ds-header .ds-brand__logo{display:block;height:clamp(38px,6vw,52px);width:auto;max-width:none}
.ds-brand__tag{display:block;font-family:var(--sans);font-size:10px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--brown);line-height:1.3;max-width:88px;padding-left:16px;border-left:2px solid #E0C49B}
.ds-cart{display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--ink);color:var(--cream);border:2.5px solid var(--ink)}
.ds-cart--m{display:none;flex:0 0 auto;border-radius:12px;box-shadow:3px 3px 0 var(--orange)}
.ds-nav{display:flex;align-items:center;gap:8px}
.ds-nav a.ds-nav__link{display:block;font-family:var(--sans);font-size:16px;font-weight:600;color:var(--ink);padding:8px 16px;border-radius:999px}
.ds-nav a.ds-nav__link:hover{background:var(--amber);color:var(--ink)}
.ds-nav .ds-cart{margin-left:8px;border-radius:999px;box-shadow:3px 3px 0 var(--orange)}
.ds-nav .ds-cart:hover{background:var(--orange);color:var(--cream);box-shadow:3px 3px 0 var(--ink)}
.ds-menu{display:none;gap:8px;padding:8px 16px 16px;border-top:2px dashed var(--line);background:var(--cream)}
.ds-menu a.ds-menu__link{display:block;font-family:var(--serif);font-size:19px;font-weight:700;color:var(--ink);padding:16px 8px;border-bottom:1.5px solid #E7D2B2}
.ds-menu a.ds-menu__link--last{border-bottom:0}
.ds-menu a.ds-menu__cta{display:block;text-align:center;margin-top:8px;background:var(--orange);color:var(--cream);font-family:var(--serif);font-weight:800;font-size:19px;padding:16px;border-radius:999px;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
@media (max-width:899px){
  .ds-burger{display:flex}
  .ds-cart--m{display:flex}
  .ds-brand{flex:1 1 auto;min-width:0;justify-content:center;gap:0}
  .ds-brand__tag{display:none}
  .ds-nav{display:none}
  .ds-header.is-open .ds-menu{display:grid}
}

/* ==========================================================================
   Hero
   ========================================================================== */
.ds-hero{position:relative;background:var(--cream);background-image:radial-gradient(var(--dots) 1.5px,transparent 1.6px);background-size:18px 18px;border-bottom:3px solid var(--ink);overflow:hidden}
.ds-hero__in{max-width:1200px;margin:0 auto;padding:32px 16px 40px;display:flex;flex-wrap:wrap;align-items:center;gap:32px}
.ds-hero__text{flex:1 1 340px;min-width:260px}
.ds-hero__h1{font-family:var(--serif);font-weight:800;font-size:clamp(40px,9vw,74px);line-height:0.98;letter-spacing:-0.02em;text-transform:capitalize;text-align:left;margin:0;text-wrap:balance}
.ds-btn{display:block;background:var(--orange);color:var(--cream);font-family:var(--serif);font-weight:800;font-size:19px;padding:16px 24px;border-radius:999px;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink)}
.ds-btn:hover{background:var(--ink);color:var(--amber)}
.ds-hero__cta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:flex-start;margin-top:32px}
.ds-hero__cta--below{display:none;margin-top:0}
.ds-hero__pic{flex:1 1 320px;min-width:240px;position:relative;display:flex;justify-content:center}
.ds-hero__frame{position:relative;width:100%;max-width:416px}
.ds-hero__img{display:block;position:relative;width:100%;height:auto;filter:drop-shadow(6px 12px 14px rgba(35,22,15,0.28))}
.ds-badge{position:absolute;top:32%;left:9%;width:96px;height:96px;border-radius:50%;background:var(--cream);border:3px solid var(--ink);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-family:var(--serif);font-weight:800;font-size:clamp(10.5px,2.6vw,13px);line-height:1.1;letter-spacing:0.02em;transform:rotate(-11deg);box-shadow:3px 3px 0 rgba(35,22,15,0.35)}
@media (max-width:1023px){.ds-hero__h1{text-align:center}.ds-hero__cta{justify-content:center}}
@media (max-width:899px){.ds-hero__frame{max-width:288px}.ds-badge{width:72px;height:72px}}
@media (max-width:639px){
  .ds-hero__cta--inline{display:none}
  .ds-hero__cta--below{display:flex;flex:1 1 100%;flex-wrap:wrap;justify-content:center;gap:8px}
  .ds-hero__cta--below .ds-btn{text-align:center;font-size:18px;box-shadow:4px 4px 0 var(--ink)}
}

/* ==========================================================================
   Marquee strip
   ========================================================================== */
.ds-marquee{background:var(--orange);border-bottom:3px solid var(--ink);padding:16px 0;overflow:hidden;scroll-margin-top:var(--ds-header-h,80px)}
.ds-marquee__track{display:flex;width:max-content;animation:dsMarquee 34s linear infinite;will-change:transform}
.ds-marquee__group{display:flex;flex:0 0 auto;gap:24px;padding-right:24px;font-family:var(--serif);font-weight:800;font-size:clamp(20px,3vw,30px);color:var(--cream);white-space:nowrap;letter-spacing:0.01em}
.ds-marquee__star{color:var(--amber)}

/* ==========================================================================
   Shared image frame (crop / zoom / shift, same maths as the design's image slot)
   ========================================================================== */
.ds-frame{position:relative;width:100%;overflow:hidden;background:var(--stripes)}
.ds-frame img{position:absolute;display:block;max-width:none;object-fit:fill;transform:translate(-50%,-50%);left:var(--l-d,50%);top:var(--t-d,50%);width:var(--w-d,100%);height:var(--h-d,100%)}
@media (max-width:899px){.ds-frame img{left:var(--l-m,50%);top:var(--t-m,50%);width:var(--w-m,100%);height:var(--h-m,100%)}}

/* ==========================================================================
   "100% Lain" cards
   ========================================================================== */
.ds-usp{background:var(--cream);border-bottom:3px solid var(--ink)}
.ds-usp__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:24px}
.ds-card{background:#fff;border:3px solid var(--ink);border-radius:22px;padding:16px;box-shadow:6px 6px 0 var(--ink)}
.ds-card .ds-frame{aspect-ratio:4/3;border:2.5px solid var(--ink);border-radius:14px}
.ds-card__foot{display:flex;align-items:baseline;gap:8px;padding:16px 8px 8px}
.ds-num{font-family:var(--serif);font-weight:800;font-size:16px;color:var(--orange)}
.ds-card__title{font-family:var(--serif);font-weight:700;font-size:clamp(24px,2.6vw,28px);line-height:1.12;margin:0;letter-spacing:-0.01em}
@media (max-width:899px){.ds-card .ds-frame{aspect-ratio:16/9}}

/* ==========================================================================
   Video reels
   ========================================================================== */
.ds-videos{background:var(--ink);color:var(--cream);border-bottom:3px solid var(--ink)}
.ds-videos__head{max-width:1200px;margin:0 auto;padding:64px 16px 40px}
.ds-videos__head .ds-h2{margin-bottom:16px}
.ds-videos__sub{font-family:var(--sans);font-size:18px;line-height:1.55;color:var(--sand);text-align:left;margin:0;max-width:44ch;text-wrap:pretty}
@media (max-width:1023px){.ds-videos__sub{text-align:center;margin-left:auto;margin-right:auto}}
.ds-reels{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x proximity;justify-content:center;padding:0 16px 24px;scrollbar-width:none}
.ds-reels::-webkit-scrollbar{display:none}
.ds-reels.is-overflow{justify-content:flex-start}
.ds-reel.is-clone{display:none}
.ds-reel{position:relative;flex:1 1 0;width:auto;min-width:0;max-width:300px;aspect-ratio:9/16;scroll-snap-align:center;border:3px solid var(--cream);border-radius:22px;overflow:hidden;background:repeating-linear-gradient(45deg,#3A2718,#3A2718 8px,#2C1D12 8px,#2C1D12 16px);box-shadow:8px 8px 0 var(--amber)}
.ds-reel__box{position:absolute;inset:0;overflow:hidden}
.ds-reel__video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
.ds-reel__btn{position:absolute;display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:999px;border:2.5px solid var(--cream);color:var(--cream);background:rgba(35,22,15,0.72);cursor:pointer}
.ds-reel__btn svg{width:20px;height:20px}
.ds-reel__sound{bottom:16px;right:16px}
.ds-reel__sound.is-on{background:var(--amber);color:var(--ink)}
.ds-reel__max{bottom:16px;left:16px}
.ds-reel__box.is-big{position:fixed;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);z-index:2147483000;background:#000;border-radius:22px;overflow:hidden}
.ds-reel__box.is-big .ds-reel__video{object-fit:contain}
.ds-reel__box.is-big .ds-reel__sound{top:16px;left:16px;bottom:auto;right:auto}
.ds-reel__box.is-big .ds-reel__max{top:16px;right:16px;bottom:auto;left:auto}
.ds-reel-backdrop{position:fixed;inset:0;z-index:2147482999;background:rgba(35,22,15,0.82)}
@media (max-width:899px){
  .ds-reels,.ds-reels.is-overflow{justify-content:flex-start;padding-left:calc((100% - min(78vw,300px)) / 2);padding-right:calc((100% - min(78vw,300px)) / 2)}
  .ds-reel{flex:0 0 auto;width:min(78vw,300px)}
  .ds-reel.is-clone{display:block}
}
.ds-arrows{display:none;align-items:center;justify-content:center;gap:16px}
.ds-arrows__btn{display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer}
.ds-arrows__label{font-family:var(--sans);font-weight:600;font-size:16px;text-align:center}
.ds-videos .ds-arrows{padding:0 16px 56px}
.ds-videos .ds-arrows__btn{width:52px;height:52px;border-radius:999px;border:3px solid var(--cream);background:transparent;color:var(--cream)}
.ds-videos .ds-arrows__label{color:var(--sand);min-width:48px}
.ds-videos__gap{height:32px}
@media (max-width:899px){.ds-videos.has-overflow .ds-arrows{display:flex}.ds-videos.has-overflow .ds-videos__gap{display:none}}

/* ==========================================================================
   Testimonials
   ========================================================================== */
.ds-testi{background:var(--amber);border-bottom:3px solid var(--ink)}
.ds-testi__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:32px}
.ds-testi .ds-h2{margin-bottom:0;max-width:20ch}
.ds-cview{position:relative;overflow:hidden;max-width:820px;margin:0 auto;padding:0 8px 10px 0;touch-action:pan-y;user-select:none;cursor:grab}
.ds-ctrack{display:flex;flex-wrap:nowrap;justify-content:flex-start;align-items:stretch;gap:24px;transition:transform 480ms var(--ease)}
.ds-ctrack.is-snap{transition:none}
.ds-t{margin:0;background:#fff;border:3px solid var(--ink);border-radius:24px;overflow:hidden;box-shadow:6px 6px 0 var(--ink);display:flex;flex-direction:row;flex:0 0 100%;min-width:0}
.ds-t__photo{position:relative;flex:0 0 40%;align-self:stretch;min-height:360px;background:var(--stripes)}
.ds-t__photo.is-whole{background:var(--cream)}
.ds-t__photo.is-zoomable{cursor:zoom-in}
.ds-t__photo img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none}
.ds-t__photo.is-whole img{object-fit:contain}
.ds-t__zoom{position:absolute;right:12px;bottom:12px;z-index:2;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--cream);border:2.5px solid var(--ink);border-radius:999px;box-shadow:2px 2px 0 var(--ink);pointer-events:none}
.ds-t__body{display:flex;flex-direction:column;gap:16px;padding:24px;flex:1 1 0;min-width:0}
.ds-t__stars{font-family:var(--serif);font-weight:700;font-size:16px;color:var(--orange);letter-spacing:0.1em}
.ds-t__quote{margin:0;font-family:var(--sans);font-size:18px;line-height:1.5;text-wrap:pretty}
.ds-t__by{margin-top:auto;font-family:var(--sans);font-size:16px;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;color:var(--brown)}
.ds-testi .ds-arrows{display:flex;margin-top:24px}
.ds-testi .ds-arrows__btn{width:48px;height:48px;background:var(--cream);color:var(--ink);border:3px solid var(--ink);border-radius:999px}
.ds-testi .ds-arrows__btn:hover{background:var(--ink)}
.ds-testi .ds-arrows__btn:hover svg{stroke:var(--cream)}
.ds-testi .ds-arrows__label{font-weight:700;letter-spacing:0.08em;color:var(--ink)}
@media (max-width:899px){
  .ds-testi__head{justify-content:center}
  .ds-cview{max-width:none;padding:0 0 10px}
  .ds-ctrack{gap:4%}
  .ds-t{flex:0 0 78%}
}
@media (max-width:639px){
  .ds-t{flex-direction:column}
  .ds-t__photo{flex:none;width:100%;aspect-ratio:4/5;min-height:0}
}

/* Enlarge (lightbox) */
.ds-lightbox{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(35,22,15,0.9);cursor:zoom-out}
.ds-lightbox.is-open{display:flex}
.ds-lightbox__close{position:absolute;top:16px;right:16px;z-index:1;display:flex;align-items:center;justify-content:center;width:48px;height:48px;background:var(--cream);border:3px solid var(--ink);border-radius:999px;cursor:pointer}
.ds-lightbox__close:hover{background:var(--amber)}
.ds-lightbox__img{display:block;width:auto;height:auto;max-width:min(100%,760px);max-height:calc(100vh - 32px);object-fit:contain;background:var(--cream);border:3px solid var(--cream);border-radius:16px;box-shadow:8px 8px 0 var(--amber)}

/* ==========================================================================
   Pain points
   ========================================================================== */
.ds-pain{background:var(--ink);color:var(--cream);border-bottom:3px solid var(--ink)}
.ds-pain .ds-h2{max-width:24ch;margin-bottom:16px}
.ds-pain .hl{color:var(--amber)}
.ds-pain__intro{font-family:var(--sans);font-size:clamp(17px,2.2vw,21px);line-height:1.5;color:#E2C9A6;text-align:left;margin:0 0 40px;max-width:34ch}
@media (max-width:1023px){.ds-pain__intro{text-align:center;margin-left:auto;margin-right:auto}}
.ds-pain__list{display:grid;gap:0}
.ds-pain__item{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;padding:24px 0;border-bottom:1.5px solid var(--umber)}
.ds-pain__num{font-family:var(--serif);font-weight:800;font-size:clamp(34px,5vw,54px);line-height:0.9;color:var(--amber);flex:0 0 auto}
.ds-pain__body{flex:1 1 260px;min-width:220px}
.ds-pain__q{font-family:var(--serif);font-weight:700;font-size:clamp(21px,2.8vw,29px);line-height:1.15;margin:0 0 8px;color:var(--cream)}
.ds-pain__a{font-family:var(--sans);font-size:18px;line-height:1.55;margin:0;color:#DCC3A0;max-width:46ch;text-wrap:pretty}

/* ==========================================================================
   Shipping slides
   ========================================================================== */
.ds-ship{background:var(--cream);background-image:radial-gradient(var(--dots) 1.5px,transparent 1.6px);background-size:16px 16px;border-bottom:3px solid var(--ink)}
.ds-ship .ds-h2{font-size:clamp(48px,5.2vw,54px);margin-bottom:32px;max-width:20ch}
.ds-sview{position:relative}
.ds-strack{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.ds-s{border:3px solid var(--ink);border-radius:24px;background:#fff;overflow:hidden;box-shadow:6px 6px 0 var(--ink);display:flex;flex-direction:column}
.ds-s.is-clone{display:none}
.ds-s .ds-frame{aspect-ratio:4/3;border:0;border-radius:21px 21px 0 0}
.ds-s__foot{display:flex;align-items:baseline;gap:8px;padding:24px 24px 28px}
.ds-s__title{font-family:var(--serif);font-weight:700;font-size:25px;line-height:1.12;margin:0;letter-spacing:-0.01em}
.ds-ship .ds-arrows{margin-top:24px}
.ds-ship .ds-arrows__btn{width:48px;height:48px;background:var(--cream);color:var(--ink);border:3px solid var(--ink);border-radius:999px}
.ds-ship .ds-arrows__btn:hover{background:var(--amber)}
.ds-ship .ds-arrows__label{font-weight:700;letter-spacing:0.08em;color:var(--brown)}
@media (max-width:899px){
  .ds-sview{overflow:hidden;touch-action:pan-y;user-select:none;cursor:grab}
  .ds-strack{display:flex;align-items:stretch;gap:4%;transition:transform 480ms var(--ease)}
  .ds-strack.is-snap{transition:none}
  .ds-s{flex:0 0 78%}
  .ds-s.is-clone{display:flex}
  .ds-s .ds-frame{aspect-ratio:3/2}
  .ds-s__title{font-size:26px}
  .ds-ship .ds-arrows{display:flex}
}
.ds-checker{height:22px;background:repeating-conic-gradient(#23160F 0 25%,#F7A600 0 50%) 0 0/28px 28px;border-bottom:3px solid var(--ink)}

/* ==========================================================================
   Order
   ========================================================================== */
.ds-order{background:var(--brick);border-bottom:3px solid var(--ink)}
.ds-order__in{max-width:900px;margin:0 auto;padding:64px 16px}
.ds-order__h2{font-family:var(--serif);font-weight:800;font-size:clamp(40px,5.6vw,58px);line-height:1;letter-spacing:-0.02em;text-align:left;margin:0 0 16px;color:var(--cream);text-wrap:balance}
.ds-order__intro{font-family:var(--sans);font-size:clamp(18px,2.1vw,20px);line-height:1.5;color:#fff;text-align:left;margin:0 0 32px;max-width:42ch}
@media (max-width:1023px){.ds-order__h2{text-align:center}.ds-order__intro{text-align:center;margin-left:auto;margin-right:auto}}
.ds-box{background:var(--cream);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:24px}
.ds-box__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;margin:0 0 16px}
.ds-h3{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--brown);margin:0}
.ds-h3--sp{margin:32px 0 16px}
.ds-weight{font-family:var(--sans);font-size:16px;color:var(--brown)}
.ds-weight strong{font-weight:700;color:var(--ink)}
.ds-tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:8px;margin:0 0 16px}
.ds-tier{padding:12px;border-radius:12px;text-align:center;border:2.5px solid var(--line);background:transparent;color:var(--brown)}
.ds-tier.is-on{border:3px solid var(--ink);background:var(--amber);color:var(--ink);box-shadow:3px 3px 0 var(--ink)}
.ds-tier__t{display:block;font-family:var(--serif);font-weight:800;font-size:18px;line-height:1.1}
.ds-tier__n{display:block;font-family:var(--sans);font-size:14px;margin-top:4px}
.ds-rows{display:grid;gap:16px}
.ds-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px;border-radius:16px;border:3px solid var(--ink);color:var(--ink);background:#fff;box-shadow:3px 3px 0 var(--ink)}
.ds-row.is-on{background:var(--amber);box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}
.ds-row.is-out{border:2.5px dashed #B79A6E;color:var(--brown);background:#EFE3CD;box-shadow:none;transform:none}
.ds-row__main{min-width:0}
.ds-row__name{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ds-row__t{font-family:var(--serif);font-weight:800;font-size:clamp(19px,2.6vw,23px);line-height:1.1}
.ds-row__d{display:block;font-family:var(--sans);font-size:16px;margin-top:4px}
.ds-pill{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;background:var(--ink);color:var(--cream);padding:4px 8px;border-radius:999px}
.ds-step{display:flex;align-items:center;gap:8px;flex-shrink:0}
.ds-step__b{width:44px;height:44px;flex-shrink:0;border-radius:999px;border:2.5px solid var(--ink);background:var(--cream);color:var(--ink);cursor:pointer;font-family:var(--sans);font-size:23px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;padding:0}
.ds-step__b:disabled{background:#EADCC4;opacity:0.42;cursor:not-allowed}
.ds-step__q{display:block;min-width:36px;text-align:center;font-family:var(--serif);font-weight:800;font-size:23px;line-height:1}
.ds-pick{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;margin-top:16px;padding:16px;border:2.5px dashed var(--line);border-radius:16px}
.ds-pick__a{font-family:var(--sans);font-size:16px;font-weight:600;color:var(--umber)}
.ds-pick__b{font-family:var(--sans);font-size:16px;color:var(--brown)}
.ds-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.ds-fields--sp{margin-top:16px}
.ds-field{display:block;margin-top:0}
.ds-field--wide{margin-top:16px}
.ds-field__l{display:block;font-family:var(--sans);font-size:16px;font-weight:600;margin-bottom:8px}
.ds-input{display:block;width:100%;font-family:var(--sans);font-size:16px;color:var(--ink);background:#fff;border:2.5px solid var(--ink);border-radius:12px;padding:16px;outline:none}
.ds-input:focus{box-shadow:0 0 0 3px var(--amber)}
textarea.ds-input{line-height:1.45;resize:vertical}
select.ds-input{padding-right:48px;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B4A15' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}
.ds-hint{display:block;font-family:var(--sans);font-size:14px;color:var(--brown);margin-top:8px;min-height:20px}
.ds-pays{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
.ds-pay{display:block;width:100%;text-align:left;cursor:pointer;padding:16px;border-radius:16px;border:3px solid var(--ink);color:var(--ink);background:#fff;box-shadow:3px 3px 0 var(--ink)}
.ds-pay.is-on{background:var(--amber);box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}
.ds-pay.is-soon{cursor:not-allowed;border:2.5px dashed #B79A6E;color:var(--brown);background:#EFE3CD;box-shadow:none;transform:none}
.ds-pay__t{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-family:var(--serif);font-weight:800;font-size:19px;line-height:1}
.ds-pay__d{display:block;font-family:var(--sans);font-size:16px;margin-top:8px}
.ds-sum{margin-top:24px;padding-top:24px;border-top:2.5px dashed var(--line);display:grid;gap:8px}
.ds-sum__r{display:flex;justify-content:space-between;gap:16px;font-family:var(--sans);font-size:16px;color:var(--umber)}
.ds-sum__r b{font-weight:700;white-space:nowrap}
.ds-sum__r--disc{font-weight:700;color:#B8410C}
.ds-total{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding-top:16px;border-top:2.5px solid var(--ink)}
.ds-total__l{display:block;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--brown)}
.ds-total__v{display:block;font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,38px);line-height:1.1;margin-top:8px}
.ds-paybtn{display:flex;align-items:center;gap:8px;background:#EADCC4;color:var(--ink);opacity:0.55;cursor:not-allowed;pointer-events:none;font-family:var(--serif);font-weight:800;font-size:19px;padding:16px 24px;border-radius:999px;border:3px solid var(--ink);box-shadow:none}
.ds-paybtn.is-ready{background:var(--orange);color:var(--cream);opacity:1;cursor:pointer;pointer-events:auto;box-shadow:5px 5px 0 var(--ink)}
.ds-paybtn.is-ready:hover{background:var(--ink);color:var(--amber)}
.ds-paybtn svg{flex:0 0 auto}
.ds-miss{font-family:var(--sans);font-size:16px;font-weight:700;color:#B8410C;margin:16px 0 0}
.ds-note{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;font-family:var(--sans);font-size:16px;color:var(--brown)}
.ds-note a{color:var(--orange);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.ds-note a:hover{color:var(--ink)}
[hidden]{display:none !important}

/* ==========================================================================
   Agent call to action
   ========================================================================== */
.ds-agent{background:var(--cream);border-bottom:3px solid var(--ink)}
.ds-agent__in{max-width:1200px;margin:0 auto;padding:48px 16px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.ds-agent__text{flex:1 1 320px}
.ds-agent__h2{font-family:var(--serif);font-weight:800;font-size:clamp(40px,4vw,48px);line-height:1.05;letter-spacing:-0.02em;text-align:left;margin:0 0 8px;text-wrap:balance}
.ds-agent__p{font-family:var(--sans);font-size:18px;line-height:1.5;color:var(--umber);text-align:left;margin:0;max-width:44ch;text-wrap:pretty}
.ds-agent__btn{display:block;flex:0 0 auto;background:var(--ink);color:var(--amber);font-family:var(--serif);font-weight:700;font-size:18px;padding:16px 24px;border-radius:999px;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--amber)}
.ds-agent__btn:hover{background:#C81E2A;color:var(--cream)}
@media (max-width:1023px){.ds-agent__h2,.ds-agent__p{text-align:center}.ds-agent__p{margin-left:auto;margin-right:auto}}
@media (max-width:899px){.ds-agent__in{justify-content:center}}

/* ==========================================================================
   Footer
   ========================================================================== */
.ds-footer{background:var(--ink);color:var(--cream)}
.ds-footer__top{max-width:1200px;margin:0 auto;padding:56px 16px 24px;display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.ds-footer__brand{flex:1 1 320px;min-width:260px}
.ds-footer__logo{display:inline-block;background:var(--cream);border:2.5px solid var(--cream);border-radius:14px;padding:16px}
.ds-footer__logo img{display:block;height:44px;width:auto}
.ds-footer__blurb{font-family:var(--sans);font-size:16px;line-height:1.55;color:var(--sand);margin:16px 0 0;max-width:32ch;text-wrap:pretty}
.ds-social{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.ds-social a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:2.5px solid var(--sand);border-radius:999px;color:var(--cream)}
.ds-social a:hover{background:var(--amber);border-color:var(--amber);color:var(--ink)}
.ds-footer__cols{display:flex;flex-wrap:wrap;gap:56px;flex:0 1 auto}
.ds-footer__h{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--sand);margin:0 0 16px}
.ds-footer__links{display:grid;gap:8px}
.ds-footer__links a{display:block;font-family:var(--sans);font-size:16px;color:var(--cream)}
.ds-footer__links a:hover{color:var(--amber)}
.ds-footer__bar{border-top:1.5px solid var(--umber)}
.ds-footer__bar-in{max-width:1200px;margin:0 auto;padding:16px;display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;font-family:var(--sans);font-size:16px;color:var(--sand)}
.ds-paylogos{display:flex;flex-wrap:wrap;align-items:center;gap:0}
.ds-paylogo{display:flex;align-items:center;justify-content:center;width:46px;height:30px;padding:3px 2px}
.ds-paylogo img{display:block;max-width:100%;max-height:100%;object-fit:contain}
.ds-paylogo.is-invert img{filter:invert(1) hue-rotate(180deg) brightness(1.15)}

/* ==========================================================================
   Standard pages (policies) and fallbacks
   ========================================================================== */
.ds-page{max-width:820px;margin:0 auto;padding:64px 16px}
.ds-page__title{font-family:var(--serif);font-weight:800;font-size:clamp(36px,5vw,54px);line-height:1.05;letter-spacing:-0.02em;margin:0 0 32px;text-wrap:balance}
.ds-prose{font-family:var(--sans);font-size:18px;line-height:1.65;color:var(--ink)}
.ds-prose h2,.ds-prose h3,.ds-prose h4{font-family:var(--serif);font-weight:700;line-height:1.15;letter-spacing:-0.01em;margin:40px 0 12px}
.ds-prose h2{font-size:clamp(26px,3vw,32px)}
.ds-prose h3{font-size:clamp(22px,2.4vw,26px)}
.ds-prose p{margin:0 0 16px}
.ds-prose ul,.ds-prose ol{margin:0 0 16px;padding-left:24px}
.ds-prose li{margin:0 0 6px}
.ds-prose a{text-decoration:underline;text-underline-offset:3px}
.ds-prose table{border-collapse:collapse;width:100%;margin:0 0 16px}
.ds-prose th,.ds-prose td{border:2px solid var(--ink);padding:8px 12px;text-align:left}

/* ==========================================================================
   WooCommerce (classic checkout / thank-you), styled like the rest of the site
   ========================================================================== */
.ds-page--wide{max-width:900px}
.ds-page .woocommerce{font-family:var(--sans);font-size:16px;color:var(--ink)}
.ds-page .woocommerce h3,.ds-page .woocommerce #order_review_heading{font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;color:var(--brown);margin:32px 0 16px}
.ds-page .woocommerce .woocommerce-billing-fields>h3:first-child{margin-top:8px}
.ds-page .woocommerce a{color:var(--orange)}
.ds-page .woocommerce a:hover{color:var(--ink)}

/* Notices and coupon toggle */
.ds-page .woocommerce .woocommerce-info,.ds-page .woocommerce .woocommerce-message,.ds-page .woocommerce .woocommerce-error{background:var(--cream);color:var(--ink);border:2.5px dashed var(--line);border-radius:16px;padding:16px;margin:0 0 24px;list-style:none}
.ds-page .woocommerce .woocommerce-info::before,.ds-page .woocommerce .woocommerce-message::before,.ds-page .woocommerce .woocommerce-error::before{display:none}
.ds-page .woocommerce .woocommerce-error{border:2.5px solid #B8410C;color:#B8410C;font-weight:700}
.ds-page .woocommerce .woocommerce-error li{margin:0}
.ds-page .woocommerce form.checkout_coupon{border:2.5px dashed var(--line);border-radius:16px;padding:16px;margin:0 0 24px}

/* Layout: one column, like the homepage form */
.ds-page .woocommerce form.checkout #customer_details .col-1,.ds-page .woocommerce form.checkout #customer_details .col-2{float:none;width:100%}
.ds-page .woocommerce form.checkout #order_review_heading,.ds-page .woocommerce form.checkout #order_review{float:none;width:100%;clear:both}
.ds-page .woocommerce .woocommerce-billing-fields__field-wrapper,.ds-page .woocommerce .woocommerce-shipping-fields__field-wrapper{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}
.ds-page .woocommerce form .form-row{float:none;width:auto;margin:0;padding:0}
.ds-page .woocommerce form .form-row-wide,.ds-page .woocommerce form #billing_address_1_field,.ds-page .woocommerce form #billing_address_2_field,.ds-page .woocommerce form #order_comments_field{grid-column:1/-1}
.ds-page .woocommerce form .form-row label{display:block;font-family:var(--sans);font-size:16px;font-weight:600;margin:0 0 8px;line-height:1.3}
.ds-page .woocommerce form .form-row .required{color:var(--orange);text-decoration:none}
.ds-page .woocommerce form .form-row input.input-text,.ds-page .woocommerce form .form-row textarea,.ds-page .woocommerce form .form-row select,.ds-page .woocommerce .select2-container .select2-selection--single{display:block;width:100%;font-family:var(--sans);font-size:16px;color:var(--ink);background:#fff;border:2.5px solid var(--ink);border-radius:12px;padding:16px;height:auto;outline:none;box-shadow:none}
.ds-page .woocommerce .select2-container .select2-selection--single{padding:0;height:56px;display:flex;align-items:center}
.ds-page .woocommerce .select2-container .select2-selection__rendered{padding:0 48px 0 16px;line-height:normal;color:var(--ink)}
.ds-page .woocommerce .select2-container .select2-selection__arrow{height:100%;right:12px}
.ds-page .woocommerce form .form-row input.input-text:focus,.ds-page .woocommerce form .form-row textarea:focus,.ds-page .woocommerce form .form-row select:focus{box-shadow:0 0 0 3px var(--amber)}
.ds-page .woocommerce form .form-row textarea{line-height:1.45;min-height:110px;resize:vertical}

/* Order review */
.ds-page .woocommerce .woocommerce-checkout-review-order{background:var(--cream);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:24px}
.ds-page .woocommerce table.shop_table{border:0;border-collapse:collapse;width:100%;margin:0 0 24px;background:transparent}
.ds-page .woocommerce table.shop_table th,.ds-page .woocommerce table.shop_table td{border:0;border-top:2.5px dashed var(--line);padding:12px 0;font-size:16px;vertical-align:top;background:transparent}
.ds-page .woocommerce table.shop_table thead th{border-top:0;font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--brown)}
.ds-page .woocommerce table.shop_table .product-total,.ds-page .woocommerce table.shop_table td:last-child{text-align:right}
.ds-page .woocommerce table.shop_table dl.variation,.ds-page .woocommerce table.shop_table .wc-item-meta{margin:6px 0 0;font-size:14px;color:var(--brown)}
.ds-page .woocommerce table.shop_table dl.variation dt,.ds-page .woocommerce table.shop_table dl.variation dd{display:inline;margin:0}
.ds-page .woocommerce table.shop_table dl.variation dd p{display:inline;margin:0}
.ds-page .woocommerce table.shop_table tr.order-total th,.ds-page .woocommerce table.shop_table tr.order-total td{border-top:2.5px solid var(--ink);padding-top:16px}
.ds-page .woocommerce table.shop_table tr.order-total td,.ds-page .woocommerce table.shop_table tr.order-total td .amount{font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,38px);line-height:1.1}

/* Payment methods look like the homepage payment buttons */
.ds-page .woocommerce #payment{background:transparent;border-radius:0}
.ds-page .woocommerce #payment ul.payment_methods{list-style:none;margin:0 0 24px;padding:0;border:0;display:grid;gap:16px}
.ds-page .woocommerce #payment ul.payment_methods li{margin:0;padding:16px;border:3px solid var(--ink);border-radius:16px;background:#fff;box-shadow:3px 3px 0 var(--ink);list-style:none}
.ds-page .woocommerce #payment ul.payment_methods li:has(input[type=radio]:checked){background:var(--amber);box-shadow:5px 5px 0 var(--ink);transform:translate(-1px,-1px)}
.ds-page .woocommerce #payment ul.payment_methods li label{display:inline;font-family:var(--serif);font-weight:800;font-size:19px;margin:0;cursor:pointer}
.ds-page .woocommerce #payment ul.payment_methods li img{max-height:24px;width:auto;margin-left:8px;vertical-align:middle}
.ds-page .woocommerce #payment ul.payment_methods li input[type=radio]{margin-right:8px;accent-color:var(--ink)}
.ds-page .woocommerce #payment div.payment_box{background:transparent;color:var(--ink);font-size:16px;padding:8px 0 0;margin:0}
.ds-page .woocommerce #payment div.payment_box::before{display:none}
.ds-page .woocommerce #payment div.payment_box p{margin:0}
.ds-page .woocommerce #payment .place-order{padding:0;margin:0}
.ds-page .woocommerce .woocommerce-privacy-policy-text,.ds-page .woocommerce .woocommerce-terms-and-conditions-wrapper{font-size:14px;color:var(--brown);margin:0 0 16px}
.ds-page .woocommerce #place_order,.ds-page .woocommerce a.button,.ds-page .woocommerce button.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--orange);color:var(--cream);font-family:var(--serif);font-weight:800;font-size:19px;padding:16px 24px;border-radius:999px;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer;float:none;width:auto}
.ds-page .woocommerce #place_order{width:100%}
.ds-page .woocommerce #place_order:hover,.ds-page .woocommerce a.button:hover,.ds-page .woocommerce button.button:hover{background:var(--ink);color:var(--amber)}

/* Thank-you page */
.ds-page .woocommerce .woocommerce-order{background:var(--cream);border:3px solid var(--ink);border-radius:26px;box-shadow:8px 8px 0 var(--ink);padding:24px}
.ds-page .woocommerce ul.order_details{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:12px;background:transparent}
.ds-page .woocommerce ul.order_details li{float:none;border:0;margin:0;padding:0;font-size:14px;color:var(--brown);text-transform:uppercase;letter-spacing:0.08em}
.ds-page .woocommerce ul.order_details li strong{display:block;font-size:18px;letter-spacing:0;text-transform:none;color:var(--ink)}

/* Malaysia only, shipping = billing: hide the fixed country field and the different-address toggle */
.ds-page .woocommerce #billing_country_field,.ds-page .woocommerce #ship-to-different-address,.ds-page .woocommerce .woocommerce-shipping-fields{display:none !important}
