/* Shared prototype presentation; approved white/orange direction. */
body{font-family:Barlow,Arial,sans-serif;background:#fff;color:#202622}
h1,h2,h3{font-family:Barlow,Arial,sans-serif;font-weight:600}
button,input,select,textarea{font-family:inherit}
[hidden]{display:none!important}
header.spice-header{position:relative;inset:auto;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:32px;width:100%;max-width:none;height:auto;min-height:100px;margin:0;padding:24px 6%;background:#fff;color:#202622;border-bottom:1px solid #e9ebe7;box-sizing:border-box}
a.spice-wordmark{font-family:Barlow,Arial,sans-serif;font-size:40px;font-weight:700;letter-spacing:-2px;text-decoration:none;color:#202622;line-height:1}
a.spice-wordmark span{color:#ff6600}
nav.spice-navigation{display:flex;align-items:center;gap:28px;font-size:16px;flex-wrap:wrap}
.spice-navigation a{color:#202622;text-decoration:none;font-weight:500}
.spice-services{position:relative}
.spice-services summary{cursor:pointer;list-style:none;padding:12px 0;font-weight:500}
.spice-services summary::after{content:' +'}
.spice-services[open] summary::after{content:' −'}
.spice-services>div{position:absolute;top:100%;right:0;min-width:260px;display:grid;gap:0;background:white;border:1px solid #e3e6df;padding:12px;box-shadow:0 12px 30px #20262212;z-index:40}
.spice-services>div a{padding:12px;line-height:1.4}
.spice-services>div a:hover{background:#fff3e9}
a.spice-contact{display:inline-flex;align-items:center;justify-content:center;padding:16px 24px;border-radius:5px;background:#ff6600;color:#171c18;font-size:16px;font-weight:600;text-decoration:none;line-height:1.4;text-align:center}
.spice-header a:focus-visible,.spice-header summary:focus-visible,.spice-footer a:focus-visible{outline:3px solid #ff6600;outline-offset:5px}
footer.spice-footer{display:flex;align-items:center;justify-content:space-between;gap:40px;width:100%;max-width:none;margin:0;padding:72px 6%;border-top:1px solid #e3e6df;background:#fff;color:#202622;box-sizing:border-box}
.spice-footer .spice-motto{font-size:clamp(32px,4vw,58px);line-height:1.06;font-weight:600;letter-spacing:-.035em;color:#202622;margin:24px 0 0}
.spice-footer-action{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.spice-footer button{font-size:13px;background:white;color:#202622;border:1px solid #c7ccc5;padding:10px 14px;border-radius:4px}
@media(max-width:850px){header.spice-header{align-items:flex-start;gap:24px;flex-direction:column;padding:24px 6%}nav.spice-navigation{gap:8px 20px;font-size:15px}.spice-navigation>a{padding-top:10px;padding-bottom:10px}.spice-services>div{left:0;right:auto}.spice-footer{flex-direction:column;align-items:flex-start!important;padding:48px 6%!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Orange adaptation of the supplied shiny CTA; header only. */
@property --spice-shine-angle{syntax:'<angle>';initial-value:0deg;inherits:false}
.spice-header a.spice-contact{
 position:relative;isolation:isolate;overflow:hidden;border:2px solid transparent;
 border-radius:999px;color:#fff;font-family:Barlow,Arial,sans-serif;
 background:linear-gradient(#202622,#202622) padding-box,conic-gradient(from var(--spice-shine-angle),#ff660040 0deg,#ff6600 40deg,#ffe2a8 65deg,#ff6600 90deg,#ff660040 125deg) border-box;
 box-shadow:0 0 16px #ff660020,inset 0 0 0 1px #ff660020;
 animation:spice-shine-orbit 3s linear infinite;
 transition:box-shadow .3s ease,transform .3s ease;
}
.spice-header a.spice-contact::before{
 content:'';position:absolute;inset:3px;border-radius:inherit;pointer-events:none;z-index:-1;
 background:radial-gradient(circle at 2px 2px,#ff6600 0.5px,transparent .8px);background-size:4px 4px;
 mask-image:conic-gradient(from var(--spice-shine-angle),#000,transparent 12% 85%,#000);opacity:.35;
}
.spice-header a.spice-contact::after{
 content:'';position:absolute;inset:-100%;pointer-events:none;z-index:-1;
 background:linear-gradient(110deg,transparent 38%,#ff660012 44%,#ff660059 50%,#ff660012 56%,transparent 62%);
 animation:spice-shine-sweep 3s linear infinite;
}
.spice-header a.spice-contact:hover,.spice-header a.spice-contact:focus-visible{color:#fff;box-shadow:0 0 22px #ff660050,inset 0 -8px 20px #ff660035}
.spice-header a.spice-contact:active{transform:translateY(1px)}
@keyframes spice-shine-orbit{to{--spice-shine-angle:360deg}}
@keyframes spice-shine-sweep{from{transform:translateX(-35%) rotate(0deg)}to{transform:translateX(35%) rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.spice-header a.spice-contact,.spice-header a.spice-contact::before,.spice-header a.spice-contact::after{animation:none;transition:none}.spice-header a.spice-contact::after{opacity:.25}}

/* Contact-page WhatsApp CTA: green version of the header shine. */
a.spice-whatsapp-shine{
 position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;
 padding:18px 28px;border:2px solid transparent!important;border-radius:999px;
 font-family:Barlow,Arial,sans-serif;font-weight:600;color:#092b18!important;text-decoration:none!important;
 background:linear-gradient(#25d366,#25d366) padding-box,conic-gradient(from var(--spice-shine-angle),#128c7e,#25d366 40deg,#d6ffe7 65deg,#25d366 90deg,#128c7e 125deg) border-box;
 box-shadow:0 0 18px #25d36640;animation:spice-shine-orbit 3s linear infinite;transition:box-shadow .3s ease;
}
a.spice-whatsapp-shine::after{content:'';position:absolute;inset:-100%;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 38%,#b6ffcf20 44%,#e1ffec99 50%,#b6ffcf20 56%,transparent 62%);animation:spice-shine-sweep 3s linear infinite}
a.spice-whatsapp-shine:hover{box-shadow:0 0 28px #25d36675}
a.spice-whatsapp-shine:focus-visible{outline:3px solid #128c7e;outline-offset:5px}
@media(prefers-reduced-motion:reduce){a.spice-whatsapp-shine,a.spice-whatsapp-shine::after{animation:none;transition:none}}

/* Shared pointer lighting: keep the light beneath content on every page. */
.shared-grid-host,.brief-layout,.photo-context{position:relative;isolation:isolate}
.shared-grid-host{background-image:linear-gradient(to right,#2c35310b 1px,transparent 1px),linear-gradient(to bottom,#2c35310b 1px,transparent 1px);background-size:300px 300px;background-position:center top}
.shared-grid-host::before,.grid-zone::after{content:none}
.cursor-grid-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(to right,rgba(255,102,0,.85) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,102,0,.85) 1px,transparent 1px);background-size:var(--cursor-grid-size,300px 300px);background-position:var(--cursor-grid-position,center top);-webkit-mask-image:radial-gradient(circle 210px at var(--grid-pointer-x,50%) var(--grid-pointer-y,150px),#000 0%,rgba(0,0,0,.8) 25%,transparent 100%);mask-image:radial-gradient(circle 210px at var(--grid-pointer-x,50%) var(--grid-pointer-y,150px),#000 0%,rgba(0,0,0,.8) 25%,transparent 100%);opacity:var(--grid-pointer-active,0);transition:opacity .25s ease;filter:drop-shadow(0 0 3px #ff660088)}
.wide-grid>.cursor-grid-light{left:calc(50% - 50vw);right:auto;width:100vw;z-index:1;background-size:var(--grid-size,300px) var(--grid-size,300px);background-position:center top}
@media(prefers-reduced-motion:reduce){.cursor-grid-light{display:none}}

/* One grouped brand lockup, shared by the header and footer. */
:root{--spice-orange:#ff6600}
a.spice-wordmark{display:inline-flex;flex-shrink:0}
a.spice-wordmark .spice-brand-lockup{display:inline-flex;align-items:center;gap:14px;color:#202622}
a.spice-wordmark .spice-brand-type{display:flex;flex-direction:column;color:#202622}
a.spice-wordmark .spice-brand-name{display:block;color:#202622;font-size:40px;line-height:.95;letter-spacing:-2px}
a.spice-wordmark .spice-brand-dot,a.spice-wordmark .spice-brand-consulting{color:var(--spice-orange)}
a.spice-wordmark .spice-brand-consulting{display:block;font-size:20px;font-weight:600;line-height:1.2;letter-spacing:0;margin-top:3px}
a.spice-wordmark img.spice-brand-think{display:block;width:93px;height:62px;object-fit:contain;max-width:none;margin:0}
@media(max-width:1100px){header.spice-header{flex-wrap:wrap}}

/* Responsive navigation: shared across every Astro page. */
.mobile-menu-toggle{display:none}
.mobile-menu{padding:28px 24px;border:0;background:#fff;color:#202622;max-height:100dvh;max-width:none;width:min(460px,100%);height:100dvh;margin:0 0 0 auto;box-sizing:border-box;overflow-y:auto}
.mobile-menu::backdrop{background:rgba(20,24,22,.45)}
.mobile-menu:not([open]){display:none}
.mobile-menu-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:32px;font:600 18px Barlow,sans-serif}
.mobile-menu-close{padding:12px;border:1px solid #ddd;background:#fff;font:inherit;color:inherit;cursor:pointer}
.mobile-menu nav{display:flex;flex-direction:column;gap:0}
.mobile-menu nav a{display:block!important;padding:15px 0;border-bottom:1px solid #e9ebe7;color:#202622;text-decoration:none;font:500 24px/1.2 Barlow,sans-serif}
.mobile-menu nav a.mobile-contact{margin-top:24px;padding:18px;background:#ff6600;color:#171b18;border:0}
.mobile-menu a:focus-visible,.mobile-menu button:focus-visible,.mobile-menu-toggle:focus-visible{outline:3px solid #ff6600;outline-offset:4px}
@media(max-width:850px){
header.spice-header{flex-direction:row;align-items:center;flex-wrap:nowrap;min-height:90px;gap:16px;padding:18px 6%}
header.spice-header nav.spice-navigation{display:none!important}
.mobile-menu-toggle{display:flex;align-items:center;gap:8px;padding:12px 8px;min-height:44px;border:0;background:transparent;color:#202622;font:600 17px Barlow,sans-serif;cursor:pointer}
.mobile-menu-toggle span:first-child{font-size:25px;line-height:1}
.spice-header .spice-brand-lockup{font-size:28px}
.wide-grid>.cursor-grid-light{left:0;right:0;width:auto}
}

.mobile-menu nav{align-items:stretch;justify-content:flex-start;text-align:left}.mobile-menu nav a{width:100%;box-sizing:border-box}
/* Keep decorative grid layers within the section rather than scrollbar-inclusive vw. */
.wide-grid>.cursor-grid-light{left:0;right:0;width:auto}
.wide-grid{overflow-x:clip}

/* Keep the grouped logo and pathway controls comfortable on narrow phones. */
@media(max-width:380px){
header.spice-header{gap:10px}
.spice-header a.spice-wordmark .spice-brand-lockup{gap:8px}
.spice-header a.spice-wordmark .spice-brand-name{font-size:32px}
.spice-header a.spice-wordmark .spice-brand-consulting{font-size:16px}
.spice-header a.spice-wordmark img.spice-brand-think{width:69px;height:46px}
.path-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
.path-tabs button{min-width:0;font-size:25px;padding-inline:5px}
.path-tabs button>span{font-size:16px}
}