/* ============================================================
   GLISCO KITCHENS — VERSION 1 STYLESHEET  (Light Edition)
   Edit freely — this is the single source of truth for styles
   Palette: 12 curated brand colours from the brand document
============================================================ */

/* ─── DESIGN TOKENS ─── */
:root {
  /* Brand accent palette */
  --saffron:   #E6783C;   /* primary CTA — warm orange  */
  --turmeric:  #E6B432;   /* secondary highlight        */
  --chili:     #C8503C;   /* danger / emphasis          */
  --plum:      #8C5082;
  --teal:      #286496;
  --sage:      #326E64;
  --mist:      #AABEC8;
  --lavender:  #B496BE;
  --pink:      #DC8C82;
  --green:     #64AA78;
  --sand:      #C8AA96;

  /* UI surfaces */
  --bg:        #FFFFFF;
  --bg2:       #F7F5F2;
  --bg3:       #EEE9E2;
  --bgdark:    #1C1916;

  /* Text */
  --ink:       #1C1916;
  --ink2:      #3D3730;
  --ink3:      #796B60;

  /* Borders */
  --border:    rgba(28,25,22,0.10);
  --bwarm:     rgba(230,180,50,0.18);

  /* Brand colours */
  --tr:   #FDD900;
  --mcbc: #0090AD;
  --nc:   #D32F2F;
  --hd:   #FF17A3;
  --qu:   #4A3580;   /* Qulcha — deep indigo/purple from logo */
}

/* ─── RESET ─── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: 'DM Sans', sans-serif; background: var(--bg); color: var(--ink); overflow-x: hidden; cursor: none; }
img  { display: block; max-width: 100%; }
a    { color: inherit; text-decoration: none; }
button { font-family: inherit; }
ul { list-style: none; }

/* ─── CURSOR ─── */
#cdot  { width:10px; height:10px; background:var(--saffron); border-radius:50%; position:fixed; top:0; left:0; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); transition:width .15s,height .15s; will-change:left,top; }
#cring { width:34px; height:34px; border:1.5px solid var(--saffron); border-radius:50%; position:fixed; top:0; left:0; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); transition:width .25s,height .25s,border-color .25s; opacity:.45; will-change:left,top; }
body.hs #cdot  { width:18px; height:18px; }
body.hs #cring { width:50px; height:50px; border-color:var(--turmeric); }
@media (pointer:coarse) { #cdot, #cring { display:none; } body { cursor:auto; } }

/* ─── TYPOGRAPHY ─── */
.ey { font-family:'Syne',sans-serif; font-size:.67rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--saffron); display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.ey::before { content:''; display:block; width:24px; height:1px; background:var(--saffron); flex-shrink:0; }
.stitle { font-family:'Playfair Display',serif; font-size:clamp(2rem,4vw,3.3rem); font-weight:900; line-height:1.08; letter-spacing:-.025em; margin-bottom:18px; color:var(--ink); }
.sbody  { font-size:.93rem; font-weight:300; line-height:1.85; color:var(--ink3); max-width:540px; }

/* ─── BUTTONS ─── */
.btn { display:inline-flex; align-items:center; gap:8px; font-family:'Syne',sans-serif; font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:13px 26px; border:none; cursor:none; transition:background .22s,color .22s,transform .2s,filter .2s,box-shadow .2s; }
.btn-fire  { background:var(--saffron); color:#fff; box-shadow:0 2px 14px rgba(230,120,60,.22); }
.btn-fire:hover  { background:var(--chili); transform:translateY(-1px); box-shadow:0 5px 20px rgba(200,80,60,.28); }
.btn-ghost { background:transparent; color:var(--ink); border:1.5px solid var(--border); }
.btn-ghost:hover { border-color:var(--saffron); color:var(--saffron); }
.btn-dark  { background:var(--bgdark); color:#fff; }
.btn-dark:hover  { transform:translateY(-1px); box-shadow:0 5px 18px rgba(0,0,0,.22); }
.btn-sm  { padding:9px 18px; font-size:.67rem; }
.btn-tr   { background:var(--tr);   color:#1a1400; }  .btn-tr:hover   { filter:brightness(1.06); transform:translateY(-1px); }
.btn-mcbc { background:var(--mcbc); color:#fff;    }  .btn-mcbc:hover { filter:brightness(1.1);  transform:translateY(-1px); }
.btn-nc   { background:var(--nc);   color:#fff;    }  .btn-nc:hover   { filter:brightness(1.12); transform:translateY(-1px); }
.btn-hd   { background:var(--hd);   color:#fff;    }  .btn-hd:hover   { filter:brightness(1.1);  transform:translateY(-1px); }
.btn-qu   { background:var(--qu);   color:#fff;    }  .btn-qu:hover   { filter:brightness(1.12); transform:translateY(-1px); }

/* ─── REVEAL ─── */
.reveal { opacity:0; transform:translateY(26px); transition:opacity .6s ease,transform .6s ease; }
.reveal.v { opacity:1; transform:translateY(0); }

/* ─── DIVIDER ─── */
.spice { height:1px; background:linear-gradient(to right,transparent,var(--turmeric),var(--saffron),var(--chili),transparent); opacity:.28; }

/* ─── NAV ─── */
#nav { position:fixed; top:0; left:0; right:0; z-index:900; padding:18px 48px; display:flex; align-items:center; justify-content:space-between; gap:20px; background:rgba(255,255,255,.88); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-bottom:1px solid var(--border); transition:background .3s,padding .3s,box-shadow .3s; }
#nav.sc { padding-top:13px; padding-bottom:13px; background:rgba(255,255,255,.97); box-shadow:0 1px 18px rgba(0,0,0,.07); }
.nlogo    { font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:900; letter-spacing:-.02em; flex-shrink:0; color:var(--ink); }
.nlogo em { color:var(--saffron); font-style:normal; }
.nlinks   { display:flex; gap:30px; }
.nlinks a { font-family:'Syne',sans-serif; font-size:.7rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); transition:color .2s; }
.nlinks a:hover, .nlinks a.act { color:var(--saffron); }
.nctas    { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.hbg      { display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:none; padding:4px; }
.hbg span { width:24px; height:2px; background:var(--ink); display:block; transition:all .3s; }
.hbg.op span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hbg.op span:nth-child(2) { opacity:0; }
.hbg.op span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ─── MOBILE DRAWER ─── */
#drawer { position:fixed; inset:0; z-index:800; background:var(--bg); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:26px; transform:translateX(100%); transition:transform .35s cubic-bezier(.77,0,.175,1); }
#drawer.op { transform:translateX(0); }
#drawer a { font-family:'Playfair Display',serif; font-size:clamp(1.5rem,5vw,2.1rem); font-weight:700; color:var(--ink); transition:color .2s; }
#drawer a:hover { color:var(--saffron); }

/* ─── HERO ─── */
.hero { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; position:relative; overflow:hidden; background:var(--bg); }
.hbg-layer { position:absolute; inset:0;
  background:
    radial-gradient(ellipse 55% 60% at 78% 50%, rgba(230,180,50,.07), transparent 70%),
    radial-gradient(ellipse 40% 50% at 10% 80%, rgba(230,120,60,.05), transparent 62%),
    radial-gradient(ellipse 38% 38% at 88% 8%,  rgba(180,150,190,.06), transparent 58%),
    var(--bg);
}
.hbg-layer::after { content:''; position:absolute; inset:0; opacity:.018; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E"); pointer-events:none; }
.hvline { position:absolute; top:0; left:50%; width:1px; height:100%; background:linear-gradient(to bottom,transparent,rgba(230,180,50,.18),transparent); }
.hleft  { position:relative; z-index:2; display:flex; flex-direction:column; justify-content:center; padding:130px 56px 80px; }
/* Tag: two lines — kitchen label + est. year, no decorative lines */
.htag   { font-family:'Syne',sans-serif; font-size:.67rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--saffron); margin-bottom:26px; display:flex; flex-direction:column; gap:5px; animation:sUp .7s .05s both; }
.htag-line { display:block; }
.hh1    { font-family:'Playfair Display',serif; font-size:clamp(3.2rem,6.5vw,6rem); font-weight:900; line-height:.98; letter-spacing:-.03em; color:var(--ink); }
.hh1 .l1 { display:block; animation:sUp .75s .12s both; }
.hh1 .l2 { display:block; color:var(--saffron); animation:sUp .75s .22s both; }
.hh1 .l3 { display:block; font-style:italic; color:var(--ink2); animation:sUp .75s .32s both; }
@keyframes sUp { from { transform:translateY(64px); opacity:0; } to { transform:translateY(0); opacity:1; } }
@keyframes fUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
.hsub   { font-size:.93rem; font-weight:300; line-height:1.8; color:var(--ink3); max-width:430px; margin:26px 0 38px; animation:fUp .9s .5s both; }
.hctas  { display:flex; flex-wrap:wrap; gap:12px; animation:fUp .9s .65s both; }
.hstats { display:flex; gap:36px; flex-wrap:wrap; margin-top:52px; padding-top:32px; border-top:1px solid var(--border); animation:fUp .9s .8s both; }
.snum   { display:block; font-family:'Playfair Display',serif; font-size:1.85rem; font-weight:900; color:var(--saffron); line-height:1; margin-bottom:4px; }
.slbl   { font-family:'Syne',sans-serif; font-size:.6rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); }
/* Hero right panel */
.hright { position:relative; z-index:2; display:flex; align-items:center; justify-content:center; padding:130px 48px 80px; }
.hcard  { position:relative; width:100%; max-width:395px; background:#fff; border:1px solid var(--border); padding:38px; animation:fUp 1s .4s both; box-shadow:0 8px 36px rgba(0,0,0,.06); }
.hcey   { font-family:'Syne',sans-serif; font-size:.59rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--saffron); margin-bottom:9px; }
.hcard h3 { font-family:'Playfair Display',serif; font-size:clamp(1.6rem,2.4vw,2.2rem); font-weight:900; margin-bottom:26px; line-height:1.1; color:var(--ink); letter-spacing:-.02em; }
.bmg    { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.bmi    { padding:15px; background:var(--bg2); transition:background .25s; cursor:none; }
.bmi:hover { background:var(--bg3); }
.bmid   { width:7px; height:7px; border-radius:50%; margin-bottom:8px; }
.bmi h4 { font-family:'Syne',sans-serif; font-size:.73rem; font-weight:700; margin-bottom:3px; color:var(--ink); }
.bmi p  { font-size:.67rem; color:var(--ink3); line-height:1.4; }
/* Orbit rings */
.rings { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:0; height:0; pointer-events:none; }
.ring  { position:absolute; border-radius:50%; border:1px solid; top:50%; left:50%; transform:translate(-50%,-50%); animation:orb linear infinite; }
.ra    { width:360px; height:360px; border-color:rgba(230,120,60,.07); animation-duration:45s; }
.rb    { width:275px; height:275px; border-color:rgba(230,180,50,.09); animation-duration:28s; animation-direction:reverse; }
.rc    { width:190px; height:190px; border-color:rgba(40,100,150,.06); animation-duration:38s; }
@keyframes orb { to { transform:translate(-50%,-50%) rotate(360deg); } }

/* ─── TICKER ─── */
.tkw { background:var(--saffron); overflow:hidden; padding:11px 0; }
.tkt { display:flex; width:max-content; animation:tk 32s linear infinite; }
.tki { font-family:'Syne',sans-serif; font-size:.67rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#fff; padding:0 34px; white-space:nowrap; }
.tks { color:rgba(255,255,255,.45); }
@keyframes tk { from { transform:translateX(0); } to { transform:translateX(-50%); } }

/* ─── SECTION LAYOUT ─── */
.sec { padding:92px 56px; }
#growth        { background:var(--bg);  position:relative; overflow:hidden; }
#journey       { background:#F4F0F7; }  /* soft lavender tint — #B496BE at ~10% */
#brands        { background:var(--bg);  }
#infrastructure{ background:#EFF5F8; }  /* soft mist tint — #AABEC8 at ~14% */
#catering      { background:var(--bg);  }
#franchise     { background:#F0F5F0; }  /* soft sage tint — #326E64 at ~8% */
#ctaband       { background:var(--bgdark); padding:68px 56px; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; }
#careers       { background:#FAF5EF; }  /* warm sand tint — #C8AA96 at ~12% */

/* ─── GROWTH ─── */
.ggrid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:52px; }
.gc    { background:#fff; border:1px solid var(--border); padding:42px; box-shadow:0 2px 8px rgba(0,0,0,.03); transition:transform .3s,box-shadow .3s; border-top:3px solid transparent; }
.gc:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.08); }
.gc:nth-child(1) { border-top-color:var(--teal); }
.gc:nth-child(2) { border-top-color:var(--saffron); }
.gc:nth-child(3) { border-top-color:var(--sage); }
.gc:nth-child(4) { border-top-color:var(--plum); }
.gn    { font-family:'Playfair Display',serif; font-size:clamp(2.4rem,5vw,3.7rem); font-weight:900; color:var(--saffron); line-height:1; display:block; margin-bottom:9px; }
.gc:nth-child(1) .gn { color:var(--teal); }
.gc:nth-child(3) .gn { color:var(--sage); }
.gc:nth-child(4) .gn { color:var(--plum); }
.gl    { font-family:'Syne',sans-serif; font-size:.88rem; font-weight:700; margin-bottom:5px; color:var(--ink); }
.gs    { font-size:.8rem; color:var(--ink3); line-height:1.65; }
.gpull { margin-top:52px; padding:38px 42px; background:var(--bg2); border-left:3px solid var(--saffron); }
.gpull p    { font-family:'Playfair Display',serif; font-size:clamp(1rem,2.2vw,1.35rem); font-style:italic; line-height:1.65; color:var(--ink); }
.gpull cite { display:block; margin-top:16px; font-family:'Syne',sans-serif; font-size:.6rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--saffron); font-style:normal; }

/* ─── JOURNEY ─── */
.jgrid { display:grid; grid-template-columns:1fr 1fr; gap:68px; margin-top:52px; align-items:start; }
.tl    { display:flex; flex-direction:column; }
.ti    { display:flex; gap:18px; padding-bottom:32px; position:relative; }
.ti:not(:last-child)::after { content:''; position:absolute; left:13px; top:28px; width:1px; bottom:0; background:linear-gradient(to bottom,rgba(230,120,60,.25),transparent); }
.tdot  { width:26px; height:26px; border-radius:50%; flex-shrink:0; background:#fff; border:1.5px solid var(--border); display:flex; align-items:center; justify-content:center; box-shadow:0 1px 6px rgba(0,0,0,.05); }
.tdi   { width:7px; height:7px; border-radius:50%; background:var(--saffron); }
/* Year badge on timeline dot */
.ti-year { font-family:'Syne',sans-serif; font-size:.58rem; font-weight:800; color:var(--saffron); letter-spacing:.04em; white-space:nowrap; margin-top:4px; }
.tb h4 { font-family:'Syne',sans-serif; font-size:.8rem; font-weight:700; margin-bottom:5px; color:var(--ink); }
.tb p  { font-size:.8rem; color:var(--ink3); line-height:1.65; }
.jaside { background:#fff; border:1px solid var(--border); padding:42px; box-shadow:0 4px 22px rgba(0,0,0,.05); }
.jbadge { display:inline-flex; align-items:center; gap:7px; font-family:'Syne',sans-serif; font-size:.59rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--chili); margin-bottom:13px; }
.jbd    { width:6px; height:6px; border-radius:50%; background:var(--chili); }
.jaside h3 { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; line-height:1.28; margin-bottom:16px; color:var(--ink); }
.jaside p  { font-size:.86rem; color:var(--ink3); line-height:1.8; }
.jaside p + p { margin-top:13px; }
/* Scale-out list inside journey aside */
.jscale { display:flex; flex-direction:column; gap:7px; margin-top:16px; padding-top:16px; border-top:1px solid var(--border); }
.jscale li { font-size:.78rem; color:var(--ink3); line-height:1.6; display:flex; align-items:flex-start; gap:9px; }
.jscale li::before { content:'—'; color:var(--turmeric); font-size:.68rem; flex-shrink:0; margin-top:2px; }

/* ─── BRANDS ─── */
.bgrid { display:grid; grid-template-columns:1fr 1fr 1fr; gap:14px; margin-top:52px; }
.bc    { padding:44px 42px; position:relative; overflow:hidden; background:#fff; border:1px solid var(--border); box-shadow:0 2px 8px rgba(0,0,0,.04); transition:transform .35s,box-shadow .35s; cursor:none; }
.bc:hover { transform:translateY(-4px); box-shadow:0 12px 36px rgba(0,0,0,.10); }
.bc::before { content:''; position:absolute; inset:0; opacity:0; transition:opacity .4s; pointer-events:none; z-index:0; }
.btr::before   { background:radial-gradient(ellipse at 0% 100%,rgba(253,217,0,.13),transparent 65%); }
.bmcbc::before { background:radial-gradient(ellipse at 100% 0%,rgba(0,144,173,.10),transparent 65%); }
.bnc::before   { background:radial-gradient(ellipse at 0% 0%,rgba(211,47,47,.08),transparent 65%); }
.bhd::before   { background:radial-gradient(ellipse at 100% 100%,rgba(255,23,163,.08),transparent 65%); }
.bqu::before   { background:radial-gradient(ellipse at 0% 100%,rgba(74,53,128,.10),transparent 65%); }
.bc:hover::before { opacity:1; }
.bc > * { position:relative; z-index:1; }
/* ── Brand Logo Area ── */
.brand-logo-area {
  height: 100px;
  display: flex;
  align-items: center;
  margin-bottom: 22px;
}
.brand-logo-area img {
  height: 100px;
  width: auto;
  max-width: 220px;
  object-fit: contain;
}
/* Dirty: solid-background square */
.logo-dirty-wrap {
  height: 100px;
  width: 100px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 6px;
}
.logo-dirty-wrap img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  display: block;
}

.btag  { display:inline-block; font-family:'Syne',sans-serif; font-size:.57rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; padding:4px 11px; border-radius:100px; margin-bottom:13px; }
.bc h3 { font-family:'Playfair Display',serif; font-size:1.5rem; font-weight:900; line-height:1.14; margin-bottom:5px; }
.bsub  { font-size:.73rem; font-weight:500; text-transform:uppercase; letter-spacing:.08em; color:var(--ink3); margin-bottom:16px; }
.bc p  { font-size:.86rem; color:var(--ink3); line-height:1.75; margin-bottom:22px; }
.bpills { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:25px; }
.pill   { font-size:.6rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:3px 10px; border-radius:100px; background:var(--bg2); border:1px solid var(--border); color:var(--ink3); }
.bacts  { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
/* Instagram icon — icon only, no visible text label */
.big    { display:inline-flex; align-items:center; color:var(--ink3); transition:color .2s; padding:4px; }
.big:hover { color:var(--ink); }
.big svg { width:18px; height:18px; fill:currentColor; flex-shrink:0; }
.bcs    { font-family:'Syne',sans-serif; font-size:.58rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); opacity:.45; display:inline-flex; align-items:center; gap:5px; }
.bcs svg { width:14px; height:14px; fill:currentColor; }

/* ─── INFRASTRUCTURE ─── */
.igrid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:52px; }
.iitem { padding:34px; text-align:center; background:#fff; border:1px solid var(--border); border-top:3px solid var(--border); box-shadow:0 1px 4px rgba(0,0,0,.03); transition:background .3s,border-color .3s,transform .3s,box-shadow .3s; }
.iitem:hover { transform:translateY(-4px); box-shadow:0 8px 28px rgba(0,0,0,.08); }
.iitem:nth-child(1) { border-top-color:var(--sage); }   .iitem:nth-child(1) .iic { color:var(--sage);     background:rgba(50,110,100,.08); }
.iitem:nth-child(2) { border-top-color:var(--teal); }   .iitem:nth-child(2) .iic { color:var(--teal);     background:rgba(40,100,150,.09); }
.iitem:nth-child(3) { border-top-color:var(--mist); }   .iitem:nth-child(3) .iic { color:#3a7088;         background:rgba(170,190,200,.15); }
.iitem:nth-child(4) { border-top-color:var(--saffron); } .iitem:nth-child(4) .iic { color:var(--saffron); background:rgba(230,120,60,.09); }
.iitem:nth-child(5) { border-top-color:var(--plum); }   .iitem:nth-child(5) .iic { color:var(--plum);     background:rgba(140,80,130,.09); }
.iitem:nth-child(6) { border-top-color:var(--chili); }  .iitem:nth-child(6) .iic { color:var(--chili);    background:rgba(200,80,60,.08); }
/* Chemistry-element badge icon */
.iic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: 'Syne', sans-serif;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  width: 50px;
  height: 50px;
  border-radius: 8px;
  border: 1.5px solid var(--border);
  color: var(--saffron);
  background: var(--bg3);
  margin: 0 auto 14px;
  position: relative;
  flex-direction: column;
  gap: 0;
  line-height: 1;
}
.iic-sub {
  font-size: .38rem;
  font-weight: 700;
  color: inherit;
  opacity:.6;
  letter-spacing: 0;
  line-height: 1;
  display: block;
}
.iitem h4 { font-family:'Syne',sans-serif; font-size:.8rem; font-weight:700; margin-bottom:7px; color:var(--ink); }
.iitem p  { font-size:.76rem; color:var(--ink3); line-height:1.65; }

/* ─── CATERING ─── */
.catgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:52px; }
.cc  { padding:42px; background:#fff; border:1px solid var(--border); box-shadow:0 1px 4px rgba(0,0,0,.03); position:relative; overflow:hidden; transition:transform .3s,box-shadow .3s; }
.cc::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; transform:scaleX(0); transform-origin:left; transition:transform .35s; }
.cc:nth-child(1)::after { background:var(--teal); }
.cc:nth-child(2)::after { background:var(--sage); }
.cc:nth-child(3)::after { background:var(--plum); }
.cc:hover::after { transform:scaleX(1); }
.cc:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.08); }
.cnum { font-family:'Playfair Display',serif; font-size:3.4rem; font-weight:900; color:rgba(230,120,60,.12); line-height:1; margin-bottom:18px; }
.cc h3 { font-family:'Syne',sans-serif; font-size:.88rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-bottom:10px; color:var(--ink); }
.cc p  { font-size:.81rem; color:var(--ink3); line-height:1.75; }
.cathl  { margin-top:44px; padding:38px 42px; background:rgba(230,120,60,.05); border:1px solid rgba(230,120,60,.18); display:flex; align-items:flex-start; gap:36px; }
.cathlbl { font-family:'Syne',sans-serif; font-size:.59rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--saffron); white-space:nowrap; padding-top:3px; }
.cathl p { font-family:'Playfair Display',serif; font-size:1.05rem; line-height:1.7; font-style:italic; color:var(--ink); }
.catpol { margin-top:18px; padding:26px 42px; background:#fff; border:1px solid var(--border); display:flex; align-items:flex-start; gap:24px; }
.polbar { width:3px; height:46px; background:linear-gradient(to bottom,var(--turmeric),var(--saffron)); flex-shrink:0; margin-top:3px; }
.catpol p { font-size:.81rem; color:var(--ink3); line-height:1.75; }
.catpol strong { color:var(--ink); }
/* Catering principles list */
.cat-principles { display:flex; flex-direction:column; gap:6px; margin-top:14px; }
.cat-principles li { font-size:.78rem; color:var(--ink3); line-height:1.6; display:flex; align-items:flex-start; gap:9px; }
.cat-principles li::before { content:'—'; color:var(--turmeric); font-size:.68rem; flex-shrink:0; margin-top:2px; }

/* ─── FRANCHISE ─── */
.fgrid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:52px; }
.fc    { padding:42px; background:#fff; border:1px solid var(--border); box-shadow:0 1px 4px rgba(0,0,0,.03); transition:transform .3s,box-shadow .3s,border-color .3s; }
.fc:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.08); border-color:rgba(230,120,60,.22); }
.fc:nth-child(2) { border-top:2px solid var(--turmeric); }
.fbadge { font-family:'Playfair Display',serif; font-size:2.3rem; font-weight:900; color:var(--saffron); display:block; line-height:1; margin-bottom:11px; }
.fc:nth-child(2) .fbadge { color:var(--turmeric); }
.fc h3  { font-family:'Syne',sans-serif; font-size:.88rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; margin-bottom:4px; color:var(--ink); }
.ffor   { font-size:.72rem; color:var(--saffron); margin-bottom:18px; }
.fc:nth-child(2) .ffor { color:var(--turmeric); }
.fc p   { font-size:.81rem; color:var(--ink3); line-height:1.75; margin-bottom:16px; }
.flist  { display:flex; flex-direction:column; gap:6px; }
.flist li { font-size:.76rem; color:var(--ink3); display:flex; align-items:flex-start; gap:8px; }
.flist li::before { content:'—'; color:var(--turmeric); font-size:.68rem; flex-shrink:0; margin-top:2px; }
/* Franchise Form */
.fwrap  { margin-top:42px; padding:42px; background:#fff; border:1px solid var(--border); box-shadow:0 2px 12px rgba(0,0,0,.05); }
.fwrap h3 { font-family:'Playfair Display',serif; font-size:1.35rem; font-weight:700; margin-bottom:26px; color:var(--ink); }
.fgform { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.sp2    { grid-column:span 2; }
.fi, .fsel, .fta { width:100%; padding:12px 15px; background:var(--bg2); border:1.5px solid var(--border); color:var(--ink); font-family:'DM Sans',sans-serif; font-size:.86rem; outline:none; transition:border-color .2s,background .2s; -webkit-appearance:none; appearance:none; }
.fi::placeholder, .fta::placeholder { color:var(--ink3); opacity:.55; }
.fi:focus, .fsel:focus, .fta:focus  { border-color:var(--saffron); background:#fff; }
.fsel    { background-color:var(--bg2); cursor:none; }
.fta     { resize:vertical; }
.fsuccess { display:none; padding:22px; background:rgba(50,110,100,.08); border:1px solid rgba(50,110,100,.25); font-family:'Syne',sans-serif; font-size:.8rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--sage); margin-bottom:12px; }
.ferror   { display:none; padding:18px 22px; background:rgba(200,80,60,.07); border:1px solid rgba(200,80,60,.22); font-family:'DM Sans',sans-serif; font-size:.84rem; color:var(--chili); line-height:1.6; margin-bottom:12px; }

/* ─── CTA BAND ─── */
#ctaband h2  { font-family:'Playfair Display',serif; font-size:clamp(1.8rem,3.5vw,2.7rem); font-weight:900; color:#fff; line-height:1.1; }
#ctaband p   { font-size:.92rem; color:rgba(255,255,255,.52); margin-top:9px; }
.cba  { display:flex; flex-direction:column; gap:11px; align-items:flex-start; }
.cbal { font-family:'Syne',sans-serif; font-size:.68rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.46); transition:color .2s; }
.cbal:hover { color:#fff; }

/* ─── CAREERS ─── */
.cgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); gap:14px; margin-top:44px; }
.citem { padding:26px 18px; text-align:center; background:#fff; border:1px solid var(--border); border-top:3px solid var(--border); box-shadow:0 1px 4px rgba(0,0,0,.03); transition:transform .25s,box-shadow .25s; }
.citem:hover { transform:translateY(-3px); box-shadow:0 6px 22px rgba(0,0,0,.08); }
.citem:nth-child(1) { border-top-color:var(--teal);    } .citem:nth-child(1) .cem { color:var(--teal);    background:rgba(40,100,150,.09); }
.citem:nth-child(2) { border-top-color:var(--saffron); } .citem:nth-child(2) .cem { color:var(--saffron); background:rgba(230,120,60,.09); }
.citem:nth-child(3) { border-top-color:var(--sage);    } .citem:nth-child(3) .cem { color:var(--sage);    background:rgba(50,110,100,.09); }
.citem:nth-child(4) { border-top-color:var(--plum);    } .citem:nth-child(4) .cem { color:var(--plum);    background:rgba(140,80,130,.09); }
.citem:nth-child(5) { border-top-color:var(--pink);    } .citem:nth-child(5) .cem { color:#b05a50;        background:rgba(220,140,130,.10); }
.citem:nth-child(6) { border-top-color:var(--green);   } .citem:nth-child(6) .cem { color:#3e7a50;        background:rgba(100,170,120,.10); }
/* Chemistry-element icon for careers */
.cem {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0;
  font-family: 'Syne', sans-serif;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
  width: 46px;
  height: 46px;
  border-radius: 8px;
  background: var(--bg3);
  border: 1.5px solid var(--border);
  color: var(--saffron);
  margin: 0 auto 10px;
  line-height: 1;
}
.cem-sub {
  font-size: .36rem;
  font-weight: 700;
  color: inherit;
  opacity: .65;
  letter-spacing: 0;
  display: block;
  line-height: 1.2;
}
.citem h4 { font-family:'Syne',sans-serif; font-size:.76rem; font-weight:700; margin-bottom:4px; color:var(--ink); }
.citem p  { font-size:.7rem; color:var(--ink3); }

/* ─── FOOTER ─── */
footer { background:var(--bgdark); padding:58px 56px 26px; border-top:1px solid rgba(255,255,255,.06); }
.ftop  { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; margin-bottom:40px; }
.flogo     { font-family:'Playfair Display',serif; font-size:1.35rem; font-weight:900; display:block; margin-bottom:13px; color:#fff; }
.flogo em  { color:var(--saffron); font-style:normal; }
.fdesc     { font-size:.8rem; color:rgba(255,255,255,.36); line-height:1.75; max-width:250px; }
.fstack    { margin-top:20px; display:inline-flex; align-items:center; gap:7px; font-family:'Syne',sans-serif; font-size:.62rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--turmeric); transition:color .2s; }
.fstack:hover { color:#fff; }
.fcol h5   { font-family:'Syne',sans-serif; font-size:.6rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--saffron); margin-bottom:16px; }
.fcol ul   { display:flex; flex-direction:column; gap:9px; }
.fcol ul li a { font-size:.8rem; color:rgba(255,255,255,.38); transition:color .2s; }
.fcol ul li a:hover { color:#fff; }
.tgc   { font-size:.57rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; background:rgba(255,255,255,.08); color:rgba(255,255,255,.35); padding:2px 7px; border-radius:100px; margin-left:5px; vertical-align:middle; }
/* Instagram icon — icon only */
.fig   { display:inline-flex; align-items:center; color:rgba(255,255,255,.3); transition:color .2s; margin-top:5px; padding:2px; }
.fig:hover { color:rgba(255,255,255,.65); }
.fig svg   { width:14px; height:14px; fill:currentColor; }
.fbot  { padding-top:22px; border-top:1px solid rgba(255,255,255,.06); display:flex; flex-direction:column; gap:6px; }
.fleg  { font-size:.7rem; color:rgba(255,255,255,.2); line-height:1.7; }
.ftag  { font-size:.66rem; color:rgba(255,255,255,.1); font-family:'Syne',sans-serif; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }

/* ─── WHATSAPP FLOAT ─── */
#wa    { position:fixed; bottom:26px; right:26px; z-index:850; width:52px; height:52px; border-radius:50%; background:#25D366; display:flex; align-items:center; justify-content:center; box-shadow:0 5px 18px rgba(37,211,102,.32); transition:transform .3s,box-shadow .3s; cursor:none; }
#wa:hover { transform:scale(1.1); box-shadow:0 9px 26px rgba(37,211,102,.44); }
#wa svg   { width:25px; height:25px; fill:#fff; }
.wap   { position:absolute; inset:-4px; border-radius:50%; border:2px solid rgba(37,211,102,.38); animation:pulse 2.2s ease-out infinite; }
@keyframes pulse { 0% { transform:scale(1); opacity:.55; } 100% { transform:scale(1.5); opacity:0; } }

/* ─── RESPONSIVE ─── */
/* ═══════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════ */

/* ── Large tablet / small desktop ── */
@media (max-width:1100px) {
  .hero   { grid-template-columns:1fr; min-height:auto; }
  .hright { display:none; }
  .hleft  { padding:118px 30px 68px; }
  .sec    { padding:68px 26px; }
  #ctaband { padding:52px 26px; }
  .ftop   { grid-template-columns:1fr 1fr; gap:28px; }
  .ggrid  { grid-template-columns:1fr 1fr; }
  .jgrid  { grid-template-columns:1fr; gap:36px; }
  .bgrid  { grid-template-columns:1fr 1fr 1fr; }
  .igrid  { grid-template-columns:1fr 1fr; }
  .catgrid { grid-template-columns:1fr 1fr; }
  .fgrid  { grid-template-columns:1fr 1fr; }
  .cathl  { flex-direction:column; gap:14px; }
}

/* ── Tablet portrait ── */
@media (max-width:900px) {
  #nav { padding:15px 22px; }
  .nlinks, .nctas .btn:not(.btn-sm) { display:none; }
  .hbg { display:flex; }

  .bgrid  { grid-template-columns:1fr 1fr; }
  /* 5th brand card spans full width on tablet */
  .bgrid .bc:nth-child(5) { grid-column: 1 / -1; }

  .ggrid  { grid-template-columns:1fr 1fr; }
  .fgrid  { grid-template-columns:1fr; }
  .catgrid { grid-template-columns:1fr; }
  .ftop   { grid-template-columns:1fr 1fr; }
}

/* ── Mobile landscape / large phone ── */
@media (max-width:640px) {
  .sec    { padding:56px 18px; }
  .hleft  { padding:108px 18px 60px; }
  #ctaband { flex-direction:column; padding:48px 18px; }

  .bgrid  { grid-template-columns:1fr; }
  .bgrid .bc:nth-child(5) { grid-column: auto; }
  .bc     { padding:32px 26px; }

  .ggrid  { grid-template-columns:1fr; }
  .igrid  { grid-template-columns:1fr; }
  .cgrid  { grid-template-columns:1fr 1fr; }
  .catgrid { grid-template-columns:1fr; }
  .fgrid  { grid-template-columns:1fr; }

  .ftop   { grid-template-columns:1fr; }
  .fgform { grid-template-columns:1fr; }
  .sp2    { grid-column:span 1; }
  .hstats { gap:20px; flex-wrap:wrap; }

  /* Brand mini-items in hero — 2 col on mobile */
  .hbmis  { grid-template-columns:1fr 1fr; }
}

/* ── Small phone ── */
@media (max-width:400px) {
  .cgrid  { grid-template-columns:1fr; }
  .hh1    { font-size:2.6rem; }
  .bc     { padding:28px 18px; }
  .sec    { padding:48px 14px; }
}