:root{
  --ink:#1B0D11;
  --ink-2:#2A1218;
  --ink-3:#3A1A22;
  --crimson:#8E1B2E;
  --crimson-hi:#A82238;
  --gold:#E0A21B;
  --ivory:#F6EBDD;
  --muted:#D9C7BC;
  --dim:#A8928A;
  --line:rgba(246,235,221,0.14);
  --max:1160px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; scroll-padding-top:84px;}
body{
  margin:0; background:var(--ink); color:var(--ivory);
  font-family:'Manrope', system-ui, sans-serif; -webkit-font-smoothing:antialiased; overflow-x:hidden;
  line-height:1.5;
}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
h1,h2,h3{font-family:'DM Serif Display', serif; font-weight:400; margin:0; letter-spacing:-0.005em;}
.xwrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{outline:2px solid var(--gold); outline-offset:3px;}
@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important;} html{scroll-behavior:auto;}}

/* nav */
.xnav{position:sticky; top:0; z-index:50; background:rgba(27,13,17,0.9); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); padding-top:env(safe-area-inset-top,0px);}
.xnav-inner{display:flex; align-items:center; justify-content:space-between; padding-top:14px; padding-bottom:14px; gap:16px;}
.xbrand{display:flex; align-items:center; gap:12px; text-decoration:none;}
.xlogo{height:40px; width:auto;}
.xtag{font-size:0.68rem; letter-spacing:0.22em; font-weight:700; color:var(--gold); border:1px solid var(--gold); border-radius:4px; padding:3px 8px;}
.xlinks{display:flex; align-items:center; gap:26px;}
.xlinks a{text-decoration:none; font-size:0.9rem; color:var(--muted); font-weight:500;}
.xlinks a:hover{color:#fff;}
.xlinks .xback{color:var(--gold);}
.xbtn{
  display:inline-flex; align-items:center; gap:8px; background:var(--crimson); color:#fff !important;
  padding:11px 22px; border-radius:6px; font-weight:700; font-size:0.88rem; text-decoration:none; border:none; cursor:pointer;
  transition:background .2s ease, transform .2s ease; font-family:inherit;
}
.xbtn:hover{background:var(--crimson-hi); transform:translateY(-1px);}
.xbtn-lg{padding:15px 28px; font-size:0.95rem;}
.xbtn-ghost{display:inline-flex; align-items:center; padding:14px 26px; border:1.5px solid var(--gold); color:var(--gold); border-radius:6px; font-weight:700; font-size:0.92rem; text-decoration:none;}
.xbtn-ghost:hover{background:var(--gold); color:var(--ink);}

/* hero */
.xhero{padding:84px 0 70px;}
.xhero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px; align-items:center;}
.xbadge{display:inline-flex; align-items:center; gap:10px; font-size:0.76rem; font-weight:600; letter-spacing:0.04em; color:var(--gold); border:1px solid rgba(224,162,27,0.45); border-radius:100px; padding:7px 16px;}
.xpulse{width:8px; height:8px; border-radius:50%; background:var(--gold); animation:xp 1.8s ease-in-out infinite;}
@keyframes xp{0%,100%{opacity:1;} 50%{opacity:.3;}}
.xhero h1{font-size:clamp(2.5rem, 4.8vw, 4rem); line-height:1.04; margin:22px 0 22px;}
.xhero h1 em{color:var(--gold);}
.xlede{font-size:1.08rem; color:var(--muted); max-width:50ch; margin:0 0 32px;}
.xctas{display:flex; gap:14px; flex-wrap:wrap;}
.xhero-art svg{width:100%; max-width:440px; height:auto; margin:0 auto;}

/* separation note */
.xnote{background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.xnote-inner{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:16px; padding-bottom:16px; font-size:0.88rem; color:var(--muted);}
.xnote-inner a{color:var(--gold); text-decoration:none; font-weight:600;}
.xnote-inner a:hover{text-decoration:underline;}

/* sections */
.xsec{padding:92px 0;}
.xsec-alt{background:var(--ink-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.xeyebrow{font-size:0.74rem; letter-spacing:0.2em; text-transform:uppercase; font-weight:700; color:var(--gold); margin:0 0 14px;}
.xhead{max-width:640px; margin-bottom:46px;}
.xhead h2, .xenq-info h2{font-size:clamp(1.9rem,3.2vw,2.7rem); line-height:1.1;}
.xhead p{color:var(--muted); margin:14px 0 0; font-size:1.02rem;}
.xhead p.xeyebrow, .xenq-info p.xeyebrow{color:var(--gold); margin:0 0 14px; font-size:0.74rem;}

/* cards */
.xgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.xcard{background:var(--ink-2); border:1px solid var(--line); border-radius:14px; padding:28px; display:flex; flex-direction:column; gap:12px; transition:transform .25s ease, border-color .25s ease;}
.xcard:hover{transform:translateY(-4px); border-color:rgba(224,162,27,0.5);}
.xart{height:150px; border-radius:10px; display:flex; align-items:center; justify-content:center; margin-bottom:6px;}
.xart svg{height:120px; width:auto;}
.xart-pom{background:linear-gradient(135deg,#4A1522,#2E0E16);}
.xart-raisin{background:linear-gradient(135deg,#4B3226,#2F1E17);}
.xart-turmeric{background:linear-gradient(135deg,#4D3A12,#33260B);}
.xcard h3{font-size:1.6rem;}
.xcard p{margin:0; color:var(--muted); font-size:0.94rem;}
.xspec{list-style:none; margin:8px 0 6px; padding:0; border-top:1px solid var(--line);}
.xspec li{display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--line); font-size:0.84rem;}
.xspec li span:first-child{color:var(--dim); text-transform:uppercase; letter-spacing:0.08em; font-size:0.72rem; padding-top:1px;}
.xlink{color:var(--gold); font-weight:700; font-size:0.9rem; text-decoration:none; margin-top:auto;}
.xlink:hover{text-decoration:underline;}
.xmore{margin:30px 0 0; color:var(--dim); font-size:0.9rem;}

/* steps */
.xsteps{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.xsteps li{border-top:2px solid var(--gold); padding-top:20px;}
.xnum{font-family:'DM Serif Display',serif; font-size:2.4rem; color:var(--gold); line-height:1;}
.xsteps h4{font-size:1.1rem; margin:12px 0 8px; font-weight:700;}
.xsteps p{margin:0; color:var(--muted); font-size:0.94rem;}

/* enquiry */
.xenq-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start;}
.xenq-info p{color:var(--muted);}
.xinfo{display:flex; gap:14px; margin-top:20px; font-size:0.92rem; align-items:flex-start;}
.xinfo .k{font-size:0.68rem; letter-spacing:0.16em; font-weight:700; color:var(--gold); min-width:64px; padding-top:3px;}
.xquick{display:flex; gap:12px; margin-top:26px; flex-wrap:wrap;}
.xform{background:var(--ink-2); border:1px solid var(--line); border-radius:14px; padding:32px; display:flex; flex-direction:column; gap:16px;}
.xtwo{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.xfield{display:flex; flex-direction:column; gap:6px;}
.xfield label{font-size:0.76rem; font-weight:700; color:var(--muted); letter-spacing:0.03em;}
.xfield input, .xfield select, .xfield textarea{
  background:var(--ink); color:var(--ivory); border:1.5px solid var(--line); border-radius:8px; padding:12px 14px; font-family:inherit; font-size:0.95rem;
}
.xfield input::placeholder, .xfield textarea::placeholder{color:#7d6a64;}
.xfield input:focus, .xfield select:focus, .xfield textarea:focus{border-color:var(--gold);}
.xnote2{font-size:0.8rem; color:var(--dim); margin:0;}
.xerr{font-size:0.86rem; color:#FF9AA8; margin:0;}

/* footer */
.xfoot{border-top:1px solid var(--line); background:#140A0D; padding:48px 0 24px;}
.xfoot-inner{display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap; margin-bottom:32px;}
.xfoot p{color:var(--dim); font-size:0.88rem; margin:12px 0 0; max-width:40ch;}
.xfoot-links{display:flex; flex-direction:column; gap:12px;}
.xfoot-links a{text-decoration:none; color:var(--muted); font-size:0.92rem;}
.xfoot-links a:hover{color:var(--gold);}
.xfoot-bottom{border-top:1px solid var(--line); padding-top:20px; color:var(--dim); font-size:0.8rem;}
.xfoot-bottom-wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
@media (max-width:600px){.xfoot-bottom-wrap{padding:0 20px;}}

@media (max-width: 980px){
  .xhero-grid, .xenq-grid{grid-template-columns:1fr; gap:36px;}
  .xhero{padding-top:48px;}
  .xhero-art{order:-1;}
  .xhero-art svg{max-width:260px;}
  .xgrid, .xsteps{grid-template-columns:1fr;}
  .xlinks a:not(.xbtn):not(.xback){display:none;}
}
@media (max-width: 600px){
  .xwrap{padding-left:20px; padding-right:20px;}
  .xsec{padding:64px 0;}
  .xtwo{grid-template-columns:1fr;}
  .xform{padding:24px 20px;}
  .xlinks{gap:14px;}
  .xlinks .xbtn{padding:9px 14px;}
  .xtag{display:none;}
  .xlogo{height:34px;}
  .xctas > *{flex:1; justify-content:center;}
}
