/* =============================================================
   SHARED — Reset, Tokens, Nav, Layout, Fade, Footer
   Applies to all pages (index + all case study pages)
   ============================================================= */

/* RESET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

/* DESIGN TOKENS */
:root{
  --cream:#F8F8F8;
  --terracotta:#F45B18;
  --moss:#013F16;
  --muted:#767676;
  --dark:#04020C;
  --border:rgba(4,2,12,0.10);
  --border-dark:rgba(255,255,255,0.10);
  --nav-w:200px;
  --serif:'amandine',serif;
  --sans:'DM Sans',sans-serif;
}

/* BASE */
html{background:var(--cream);scroll-behavior:smooth}
h1,h2,h3,h4,h5,h6{font-weight:normal}
body{font-family:var(--sans);background:var(--cream);color:var(--dark);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

/* NAV — shared structure */
.sw-nav{width:var(--nav-w);position:fixed;top:0;left:0;bottom:0;display:flex;flex-direction:column;justify-content:space-between;padding:40px 28px 40px 36px;border-right:1px solid var(--border);background:var(--cream);z-index:100}
.sw-nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.sw-nav-logo svg{width:20px;height:auto;fill:var(--dark);flex-shrink:0}
.sw-nav-name{font-family:var(--serif);font-size:15px;color:var(--dark);letter-spacing:0.03em}

/* NAV — homepage links */
.sw-nav-links{list-style:none;display:flex;flex-direction:column;gap:2px}
.sw-nav-links a{font-size:12px;font-weight:400;color:var(--muted);text-decoration:none;padding:5px 0 5px 12px;display:block;transition:color 0.2s;border-left:1.5px solid transparent}
.sw-nav-links a:hover{color:var(--dark)}
.sw-nav-links a.active{color:var(--dark);font-weight:500;border-left-color:var(--terracotta)}
.sw-nav-bottom{display:flex;flex-direction:column;gap:10px}
.sw-nav-avail{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);letter-spacing:0.06em}
.sw-dot{width:7px;height:7px;border-radius:50%;background:#5A9E6F;flex-shrink:0;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.sw-nav-social{display:flex;gap:12px}
.sw-nav-social a{font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color 0.2s}
.sw-nav-social a:hover{color:var(--terracotta)}

/* NAV — case study back + TOC */
.sw-nav-back{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:500;letter-spacing:0.09em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color 0.2s;margin-top:28px}
.sw-nav-back:hover{color:var(--accent)}
.sw-nav-toc{list-style:none;display:flex;flex-direction:column;gap:2px;margin-top:8px}
.sw-nav-toc a{font-size:12px;color:var(--muted);text-decoration:none;padding:5px 0 5px 12px;display:block;border-left:1.5px solid transparent;transition:color 0.2s}
.sw-nav-toc a:hover{color:var(--dark)}
.sw-nav-toc a.active{color:var(--dark);font-weight:500;border-left-color:var(--accent)}
.sw-nav-bottom-cs{font-size:11px;color:var(--muted);letter-spacing:0.06em}

/* LAYOUT */
.sw-main{margin-left:var(--nav-w)}

/* FADE UTILITIES */
.fade{opacity:1;transform:none;transition:opacity 0.75s ease,transform 0.75s ease}
.fade-ready{opacity:0;transform:translateY(22px)}
.fade-ready.in{opacity:1;transform:none}
.fade-d1{transition-delay:0.1s}
.fade-d2{transition-delay:0.2s}
.fade-d3{transition-delay:0.3s}

/* FOOTER */
footer{background:var(--dark);padding:36px 72px;display:flex;justify-content:space-between;align-items:center}
.footer-logo{display:flex;align-items:center;gap:10px}
.footer-logo svg{width:16px;fill:var(--cream)}
.footer-wordmark{display:none}
.footer-copy{font-size:12px;color:var(--cream)}
.footer-links{display:flex;gap:20px}
.footer-links a{font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:var(--cream);text-decoration:none;transition:color 0.2s}
.footer-links a:hover{color:var(--accent,var(--terracotta))}

/* CUSTOM CURSOR */
html,body{cursor:none}
a,button,label,select,[role="button"],[tabindex]{cursor:none}
.sw-cursor{position:fixed;top:0;left:0;width:10px;height:10px;border-radius:50%;background:#04020C;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:background 0.18s ease,transform 0.12s ease;will-change:transform}
.sw-cursor.hover{transform:translate(-50%,-50%) scale(1.6)}

/* Disable custom cursor on touch devices */
@media(hover:none){
  html,body,a,button,label,select,[role="button"],[tabindex]{cursor:auto}
  .sw-cursor{display:none}
}

/* MOBILE — shared nav + layout reset */
@media(max-width:900px){
  :root{--nav-w:0px}
  .sw-nav{display:none}
  .sw-main{margin-left:0}
  footer{flex-direction:column;gap:16px;padding:28px;text-align:center}
}
