/* Quirktallyscot — House style: CARTOON. Chunky ink outlines, flat bright colours, hard offset shadows, bouncy rounded UI */
:root{
  /* Cartoon palette (legacy variable names kept so every component maps to the house style) */
  --ink:#1f1b2e;          /* outline ink — text, borders, shadows */
  --beige:#fff4d6;        /* cream page background */
  --paper:#ffffff;        /* card surface */
  --sand:#ffe8a8;         /* soft butter */
  --line:#1f1b2e;         /* outlines are ink in cartoon style */
  --rust:#ff5a36;         /* tomato — primary action */
  --rust-bright:#ff8a5c;  /* peach highlight */
  --rust-deep:#b3301a;    /* deep tomato — emphasis text */
  --brown:#1f1b2e;        /* ink — text & dark surfaces */
  --brown-soft:#4a4560;   /* muted ink */
  --sage:#7ee0b0;
  --sage-dark:#127a55;
  --sage-light:#c9f5df;
  --oak:#f0b36b;
  --sun:#ffd23f;
  --sky:#5cc8ff;
  --sky-light:#d6f1ff;
  --mint:#3ddc97;
  --pink:#ff9ecb;
  --pink-light:#ffe1ef;
  --grape:#7b5cff;

  --serif:"Arial Rounded MT Bold","Varela Round","Nunito","Chalkboard SE","Trebuchet MS",system-ui,sans-serif;
  --sans:"Nunito","Trebuchet MS","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --sp-1:4px;--sp-2:8px;--sp-3:16px;--sp-4:24px;--sp-5:40px;--sp-6:64px;

  --stroke:3px;
  --radius:22px;
  --radius-sm:12px;
  --radius-pill:999px;
  --shadow-sm:3px 3px 0 var(--ink);
  --shadow:5px 5px 0 var(--ink);
  --shadow-lg:8px 8px 0 var(--ink);
  --bounce:cubic-bezier(.34,1.56,.64,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.65;color:var(--ink);background:radial-gradient(rgba(31,27,46,.08) 1.6px,transparent 1.8px) 0 0/24px 24px,var(--beige)}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-family:var(--serif);line-height:1.15;margin:0 0 var(--sp-3);color:var(--ink);overflow-wrap:anywhere;font-weight:800}
h1{font-size:clamp(2rem,1.3rem + 3vw,3.4rem);letter-spacing:-.01em;text-shadow:3px 3px 0 var(--sun)}
h2{font-size:clamp(1.45rem,1.15rem + 1.3vw,2.1rem)}
h3{font-size:1.25rem}
p{margin:0 0 var(--sp-3)}
a{color:var(--rust-deep);font-weight:700;text-underline-offset:3px;text-decoration-thickness:2px}
a:hover{color:var(--grape)}
:focus-visible{outline:3px dashed var(--grape);outline-offset:3px;border-radius:6px}
[hidden]{display:none !important}
address{font-style:normal}
::selection{background:var(--sun);color:var(--ink)}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:var(--sp-3);top:-100px;z-index:200;padding:var(--sp-2) var(--sp-3);background:var(--sun);color:var(--ink);font-weight:800;text-decoration:none;border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}
.skip-link:focus{top:var(--sp-2);color:var(--ink)}
.container{max-width:1200px;margin:0 auto;padding:0 var(--sp-4)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:10px 22px;border:var(--stroke) solid var(--ink);background:var(--rust);color:var(--ink);font:inherit;font-family:var(--serif);font-weight:800;font-size:1rem;line-height:1.2;text-decoration:none;cursor:pointer;border-radius:var(--radius-pill);box-shadow:var(--shadow-sm);transition:background-color .15s ease,box-shadow .2s var(--bounce),transform .2s var(--bounce)}
.btn:hover{background:var(--sun);color:var(--ink);box-shadow:5px 5px 0 var(--ink);transform:translate(-2px,-2px) rotate(-1.5deg)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn:focus-visible{outline:3px dashed var(--grape);outline-offset:4px}
.btn--small{padding:7px 16px;font-size:.875rem}
.btn--ghost{background:var(--paper);color:var(--ink)}
.btn--ghost:hover{background:var(--sky-light);color:var(--ink)}
.btn--sage{background:var(--mint);color:var(--ink)}
.btn--sage:hover{background:var(--sun);color:var(--ink)}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:var(--paper);color:var(--ink);border-bottom:var(--stroke) solid var(--ink);box-shadow:0 4px 0 rgba(31,27,46,.12)}
.header-inner{max-width:1200px;margin:0 auto;padding:0 var(--sp-4);height:66px;display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3)}
.brand{display:inline-flex;align-items:center;gap:10px;min-width:0;color:var(--ink);text-decoration:none;font-family:var(--serif);font-weight:800;font-size:1.3rem;line-height:1.1;overflow-wrap:anywhere}
.brand:hover{color:var(--rust-deep)}
.brand-mark{flex:0 0 auto;width:30px;height:30px;transition:transform .3s var(--bounce)}
.brand:hover .brand-mark{transform:rotate(-12deg) scale(1.12)}
/* Recolour the inline logo to the cartoon palette */
.brand-mark path{stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round}
.site-header .brand-mark path:nth-child(1){fill:var(--rust)}
.site-header .brand-mark path:nth-child(2){fill:var(--sun)}
.site-header .brand-mark path:nth-child(3){fill:var(--ink)}
.site-header .brand-mark path:nth-child(4){stroke:var(--ink)}
.brand--footer .brand-mark path{stroke:var(--paper)}
.brand--footer .brand-mark path:nth-child(1){fill:var(--rust)}
.brand--footer .brand-mark path:nth-child(2){fill:var(--sun)}
.brand-name{min-width:0;overflow-wrap:anywhere}
.main-nav{flex:1 1 auto;min-width:0;display:flex;justify-content:center}
.nav-list{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:6px}
.nav-list li{min-width:0}
.nav-link{display:block;padding:6px 14px;color:var(--ink);text-decoration:none;font-family:var(--serif);font-size:.875rem;font-weight:800;overflow-wrap:anywhere;border:2px solid transparent;border-radius:var(--radius-pill);transition:background-color .15s ease,transform .2s var(--bounce),box-shadow .2s ease}
.nav-link:hover{color:var(--ink);background:var(--sun);border-color:var(--ink);transform:rotate(-2deg);box-shadow:2px 2px 0 var(--ink)}
.nav-link[aria-current="page"]{color:var(--ink);background:var(--sky);border-color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.header-actions{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto}
.nav-toggle{display:none;align-items:center;justify-content:center;flex-direction:column;gap:5px;width:42px;height:42px;padding:0;background:var(--sun);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);cursor:pointer}
.nav-toggle:hover{background:var(--sky);color:var(--ink)}
.nav-toggle-bar{display:block;width:18px;height:3px;border-radius:3px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

@media (min-width:768px) and (max-width:1080px){
  .nav-list{gap:2px}
  .nav-link{font-size:.8rem;padding:6px 9px}
  .brand{font-size:1.05rem}
  .header-inner{gap:var(--sp-2);padding:0 var(--sp-3)}
}
@media (max-width:767px){
  .header-inner{height:58px;padding:0 var(--sp-3)}
  .nav-toggle{display:inline-flex}
  .main-nav{position:absolute;top:calc(100% + 8px);left:var(--sp-2);right:var(--sp-2);display:none;background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);padding:var(--sp-3);box-shadow:var(--shadow-lg)}
  .main-nav.is-open{display:block;animation:popIn .3s var(--bounce) both}
  .nav-list{flex-direction:column;align-items:stretch;gap:var(--sp-2)}
  .nav-link{padding:10px 16px;font-size:1rem;border-radius:var(--radius-sm);border-color:var(--ink);background:var(--beige)}
}

/* Kicker / heads */
.kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--serif);font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink);background:var(--sun);border:2px solid var(--ink);border-radius:var(--radius-pill);padding:4px 12px;box-shadow:2px 2px 0 var(--ink);transform:rotate(-2deg);margin:0 0 var(--sp-3)}
.kicker::before{content:"";flex:0 0 auto;width:14px;height:12px;background:var(--rust);clip-path:polygon(50% 0,100% 45%,100% 100%,0 100%,0 45%)}
.section{padding:var(--sp-6) 0}
.section--ruled{border-top:var(--stroke) solid var(--ink);background:radial-gradient(rgba(31,27,46,.07) 1.6px,transparent 1.8px) 0 0/24px 24px,var(--sky-light)}
.section-head{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--sp-4);align-items:end;padding-top:var(--sp-4);margin-bottom:var(--sp-5);border-top:var(--stroke) dashed var(--ink)}
.section-head::before{content:"";position:absolute;left:0;top:-8px;width:80px;height:13px;border-radius:var(--radius-pill);background:var(--rust);border:var(--stroke) solid var(--ink)}
.section-head > *{min-width:0}
.section-head h2{margin:0}
.section-head p{margin:0;color:var(--brown-soft);font-weight:600}

/* Hero */
.hero{padding:var(--sp-5) 0 var(--sp-6);background:radial-gradient(circle 180px at 92% 4%,var(--sun) 0 99%,transparent 100%),radial-gradient(900px 420px at 80% -10%,rgba(92,200,255,.35),rgba(255,244,214,0) 70%)}
.hero-head{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-5);align-items:end;padding-bottom:var(--sp-4);margin-bottom:var(--sp-5);border-bottom:var(--stroke) dashed var(--ink)}
.hero-head > *{min-width:0}
.hero-head h1{margin:0}
.hero-dek{position:relative;margin:0;font-size:1.0625rem;font-weight:600;color:var(--ink);background:var(--paper);border:var(--stroke) solid var(--ink);border-radius:var(--radius);padding:var(--sp-3) var(--sp-4);box-shadow:var(--shadow);transform:rotate(1deg)}

/* Data grid card */
.data-card{display:flex;flex-direction:column;min-width:0;background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.card-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,110px),1fr));gap:0;background:var(--paper);color:var(--ink);border-bottom:var(--stroke) solid var(--ink)}
.stat{display:flex;flex-direction:column;gap:8px;min-width:0;padding:var(--sp-3);background:var(--sun);color:var(--ink);outline:1.5px solid var(--ink)}
.stat:nth-child(5n+2){background:var(--sky)}
.stat:nth-child(5n+3){background:var(--mint)}
.stat:nth-child(5n+4){background:var(--pink)}
.stat:nth-child(5n+5){background:var(--rust-bright)}
.stat-value{font-family:var(--serif);font-size:1.45rem;font-weight:800;line-height:1.1;color:var(--ink);overflow-wrap:anywhere}
.stat-label{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);opacity:.85;overflow-wrap:anywhere}
.card-body{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-4);min-width:0}
.card-body > *{margin:0;min-width:0}
.card-title{font-size:1.35rem;margin:0}
.card-link{display:inline-flex;align-items:center;gap:6px;font-family:var(--serif);font-weight:800;color:var(--ink);text-decoration:none;align-self:flex-start;padding:7px 16px;border:var(--stroke) solid var(--ink);border-radius:var(--radius-pill);background:var(--sun);box-shadow:var(--shadow-sm);transition:background-color .15s ease,transform .2s var(--bounce),box-shadow .2s ease}
.card-link:hover{color:var(--ink);background:var(--rust);transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:var(--sp-5) var(--sp-4)}
.guide-card{transition:box-shadow .25s var(--bounce),transform .25s var(--bounce)}
.guide-card:nth-child(odd):hover{transform:translate(-4px,-4px) rotate(-1deg)}
.guide-card:nth-child(even):hover{transform:translate(-4px,-4px) rotate(1deg)}
.guide-card:hover{box-shadow:var(--shadow-lg)}
.guide-card .card-body{flex:1}
.guide-card .card-link{margin-top:auto}

/* Planner */
.planner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr);gap:var(--sp-4);align-items:start}
.planner > *{min-width:0}
.planner-controls{animation:panelIn .7s var(--bounce) 1.2s both}
.planner-results{animation:panelIn .7s var(--bounce) 2.4s both}
.planner-controls .card-body{gap:var(--sp-3)}
.range-field{display:flex;flex-direction:column;gap:var(--sp-2);padding:10px 12px;background:var(--beige);border:2px solid var(--ink);border-radius:var(--radius-sm)}
.range-field label{font-weight:800;font-size:.9rem}
.range-value{display:inline-block;min-width:2.2em;padding:0 8px;margin-left:4px;border-radius:var(--radius-pill);background:var(--sun);color:var(--ink);font-weight:800;text-align:center;border:2px solid var(--ink)}
input[type="range"]{width:100%;accent-color:var(--rust);margin:0;min-width:0;cursor:pointer}
.result-list{margin:0;display:flex;flex-direction:column}
.result-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3);padding:12px 0;border-bottom:2px dashed rgba(31,27,46,.35)}
.result-row dt{font-size:.9rem;font-weight:600;min-width:0;overflow-wrap:anywhere;color:var(--brown-soft)}
.result-row dd{margin:0;font-family:var(--serif);font-weight:800;font-size:1.05rem;text-align:right;white-space:nowrap}
.result-row--total{border:var(--stroke) solid var(--ink);margin-top:var(--sp-3);padding:14px var(--sp-3);background:var(--sun);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm)}
.result-row--total dt{color:var(--ink);font-weight:800}
.result-row--total dd{color:var(--ink)}

.planner-stage{display:flex;flex-direction:column;gap:var(--sp-3)}
.room-stage{position:relative;width:100%;max-width:600px;margin:0 auto;aspect-ratio:1/1;perspective:1400px;perspective-origin:50% 30%;background:radial-gradient(circle at 50% 38%,#ffffff 0%,var(--sky-light) 55%,#a9e0ff 100%);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-lg);overflow:hidden;--s:34}
.room{position:absolute;left:50%;top:62%;width:calc(var(--w,4.2) * var(--s) * 1px);height:calc(var(--l,3.6) * var(--s) * 1px);transform:translate(-50%,-50%) rotateX(60deg) rotateZ(45deg);transform-style:preserve-3d;transition:width .35s var(--bounce),height .35s var(--bounce)}
.room > *{position:absolute}
.room-floor{inset:0;background:repeating-linear-gradient(90deg,#f0b36b 0 calc(var(--s) * .2px),#c98542 calc(var(--s) * .2px) calc(var(--s) * .22px)),#f0b36b;color:var(--ink);box-shadow:0 0 0 3px var(--ink);animation:floorIn .8s var(--bounce) .2s both}
.room-light-pool{inset:8%;background:radial-gradient(ellipse at 50% 50%,rgba(255,230,120,.6) 0%,rgba(255,230,120,0) 70%);color:var(--ink);transform:translateZ(1px);pointer-events:none;animation:fadeIn 1.2s ease 3s both}
.room-wall{top:0;left:0;transform-style:preserve-3d;transition:width .35s var(--bounce),height .35s var(--bounce)}
.room-wall--back{width:100%;height:calc(var(--h,2.5) * var(--s) * 1px);transform-origin:top center;transform:rotateX(90deg)}
.room-wall--left{height:100%;width:calc(var(--h,2.5) * var(--s) * 1px);transform-origin:left center;transform:rotateY(-90deg)}
.wall-face{position:absolute;inset:0;color:var(--ink)}
.wall-face--back{background:linear-gradient(to bottom,#ffffff 0 6px,#fff0c9 6px,#ffe29a 100%);transform-origin:top center;animation:wallRiseY .9s var(--bounce) .8s both;box-shadow:inset 0 0 0 3px var(--ink)}
.wall-face--left{background:linear-gradient(to right,#ffffff 0 6px,#a8e8c6 6px,#7dd6a6 100%);transform-origin:left center;animation:wallRiseX .9s var(--bounce) 1.1s both;box-shadow:inset 0 0 0 3px var(--ink)}
.wall-windows{position:absolute;left:0;right:0;top:calc(var(--s) * .9px);display:flex;justify-content:space-evenly}
.wall-window{display:block;width:calc(var(--s) * 1.2px);height:calc(var(--s) * 1.2px);background:linear-gradient(135deg,#ffffff 0 18%,var(--sky-light) 18% 45%,var(--sky) 45% 100%);border:3px solid var(--ink);border-radius:4px;box-shadow:inset 0 0 0 3px #fff}
.wall-doors{position:absolute;top:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-evenly}
.wall-door{display:block;width:calc(var(--s) * 2px);height:calc(var(--s) * .9px);max-width:92%;background:var(--grape);border:3px solid var(--ink);border-radius:3px}
.room-rug{left:20%;top:36%;width:60%;height:46%;background:repeating-linear-gradient(45deg,var(--pink) 0 8px,#ff7eb6 8px 16px);color:var(--ink);border:3px solid var(--ink);border-radius:10px;box-shadow:inset 0 0 0 4px #fff;transform:translateZ(1px);animation:fadeIn .6s ease 1.8s both}
.box{transform-style:preserve-3d;width:calc(var(--bw) * var(--s) * 1px);height:calc(var(--bd) * var(--s) * 1px);animation:dropIn .7s cubic-bezier(.2,.8,.3,1.3) both}
.box > div{position:absolute;box-shadow:inset 0 0 0 2px var(--ink)}
.box-top{inset:0;transform:translateZ(calc(var(--bh) * var(--s) * 1px))}
.box-front{left:0;top:100%;width:100%;height:calc(var(--bh) * var(--s) * 1px);transform-origin:top center;transform:rotateX(90deg)}
.box-side{top:0;left:100%;height:100%;width:calc(var(--bh) * var(--s) * 1px);transform-origin:left center;transform:rotateY(-90deg)}
.box--sofa{--bw:2;--bd:.9;--bh:.8;left:calc(50% - var(--s) * 1px);top:calc(var(--s) * .12px);animation-delay:2s}
.box--sofa .box-top{background:#ff6a45;color:#fff}
.box--sofa .box-front{background:#d93d1c;color:#fff}
.box--sofa .box-side{background:#f04e2b;color:#fff}
.box--table{--bw:1;--bd:.55;--bh:.42;left:calc(50% - var(--s) * .5px);top:calc(59% - var(--s) * .275px);animation-delay:2.3s}
.box--table .box-top{background:#ffd23f;color:var(--ink)}
.box--table .box-front{background:#e0a800;color:var(--ink)}
.box--table .box-side{background:#f0bd12;color:var(--ink)}
.box--lamp{--bw:.3;--bd:.3;--bh:1.5;left:calc(var(--s) * .2px);top:calc(100% - var(--s) * .6px);animation-delay:2.6s}
.box--lamp .box-top{background:#fff27a;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink),0 0 18px 8px rgba(255,230,110,.75)}
.box--lamp .box-front{background:var(--grape);color:#fff}
.box--lamp .box-side{background:#5a3fd6;color:#fff}
.room-pendant{left:50%;top:50%;width:calc(var(--s) * .45px);height:calc(var(--s) * .45px);border-radius:50%;background:radial-gradient(circle,#ffffff 0%,#fff27a 55%,rgba(255,220,80,0) 75%);color:var(--ink);box-shadow:0 0 30px 12px rgba(255,225,100,.6);transform:translate(-50%,-50%) translateZ(calc(var(--h,2.5) * var(--s) * .85px));animation:fadeIn 1s ease 2.9s both}
.dim-tags{position:absolute;left:var(--sp-3);right:var(--sp-3);bottom:var(--sp-3);display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.dim-tag{padding:4px 12px;background:var(--paper);color:var(--ink);font-family:var(--serif);font-size:.78rem;font-weight:800;border:2px solid var(--ink);border-radius:var(--radius-pill);box-shadow:2px 2px 0 var(--ink)}
.dim-tag:nth-child(1){background:var(--sun)}
.dim-tag:nth-child(2){background:var(--mint)}
.dim-tag:nth-child(3){background:var(--pink)}
.stage-caption{margin:0;font-size:.875rem;font-weight:600;color:var(--brown-soft);text-align:center}

@keyframes floorIn{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
@keyframes wallRiseY{from{transform:scaleY(0)}to{transform:none}}
@keyframes wallRiseX{from{transform:scaleX(0)}to{transform:none}}
@keyframes dropIn{from{opacity:0;transform:translateZ(140px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes panelIn{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}

@media (max-width:1023px){
  .planner{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .planner-stage{grid-column:1 / -1;order:-1}
}
@media (max-width:640px){
  .planner{grid-template-columns:minmax(0,1fr)}
}

/* Columns and tables */
.columns{columns:2 280px;column-gap:var(--sp-5);column-rule:2px dashed rgba(31,27,46,.35);margin-bottom:var(--sp-5)}
.columns p{break-inside:avoid}
.columns strong{color:var(--ink);background:linear-gradient(transparent 55%,var(--sun) 55%);padding:0 2px}
.table-wrap{overflow-x:auto;border:var(--stroke) solid var(--ink);border-radius:var(--radius);background:var(--paper);color:var(--ink);margin:0 0 var(--sp-4);box-shadow:var(--shadow)}
.data-table{width:100%;border-collapse:collapse;font-size:.95rem}
.data-table caption{text-align:left;padding:var(--sp-3);font-family:var(--serif);font-weight:800;font-size:1.1rem;background:var(--sun);border-bottom:var(--stroke) solid var(--ink)}
.data-table th,.data-table td{padding:12px var(--sp-3);text-align:left;vertical-align:top;border-bottom:2px solid rgba(31,27,46,.15)}
.data-table th{background:var(--sky);color:var(--ink);font-family:var(--serif);font-weight:800;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;border-bottom:var(--stroke) solid var(--ink)}
.data-table tbody tr:nth-child(even) td{background:var(--beige)}
.data-table tbody tr:hover td{background:#fff0a8}
.data-table tbody tr:last-child td{border-bottom:0}

/* Articles */
.article-head{padding-top:var(--sp-5);padding-bottom:var(--sp-4);border-bottom:var(--stroke) dashed var(--ink);position:relative}
.article-head::after{content:"";position:absolute;left:var(--sp-4);bottom:-8px;width:80px;height:13px;border-radius:var(--radius-pill);background:var(--rust);border:var(--stroke) solid var(--ink)}
.article-head h1{max-width:20ch}
.article-dek{max-width:62ch;font-size:1.125rem;font-weight:600;color:var(--brown-soft);margin:0}
.calc-section{padding-bottom:0}
.calc-stack{display:grid;gap:var(--sp-5)}
.article-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--sp-5);align-items:start}
.article-layout > *{min-width:0}
.prose{max-width:72ch}
.prose h2{margin-top:var(--sp-5);padding-top:var(--sp-3);border-top:2px dashed rgba(31,27,46,.35)}
.prose h2:first-child{margin-top:0;border-top:0;padding-top:0}
.prose ul{padding-left:var(--sp-4);margin:0 0 var(--sp-4)}
.prose li{margin-bottom:var(--sp-2)}
.prose li::marker{color:var(--rust);content:"★  "}
.prose--legal{max-width:78ch}
.article-aside{display:flex;flex-direction:column;gap:var(--sp-4);position:sticky;top:92px}
.article-figure{margin:0;border:var(--stroke) solid var(--ink);border-radius:var(--radius);background:var(--paper);color:var(--ink);overflow:hidden;box-shadow:var(--shadow);transform:rotate(1.2deg);transition:transform .3s var(--bounce)}
.article-figure:hover{transform:rotate(-1deg) scale(1.02)}
.article-figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
.article-figure figcaption{padding:var(--sp-3);font-size:.875rem;font-weight:700;color:var(--ink);background:var(--sun);border-top:var(--stroke) solid var(--ink)}
.aside-box{padding:var(--sp-4);background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:inset 0 10px 0 var(--mint),var(--shadow)}
.aside-title{font-size:1.2rem;margin:6px 0 var(--sp-3)}
.aside-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.aside-links a{display:block;font-weight:700;color:var(--ink);padding:8px 12px;border:2px solid var(--ink);border-radius:var(--radius-sm);text-decoration:none;background:var(--beige);transition:background-color .15s ease,transform .2s var(--bounce),box-shadow .2s ease}
.aside-links a:hover{background:var(--sky);color:var(--ink);transform:translate(-2px,-2px);box-shadow:3px 3px 0 var(--ink)}
.pros-cons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--sp-4);margin:0 0 var(--sp-4)}
.pc-block{min-width:0;padding:var(--sp-4);padding-top:calc(var(--sp-4) + 6px);background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.pc-block h3{font-size:1.1rem;margin-bottom:12px}
.pc-block p{margin:0}
.pc-block--pro{box-shadow:inset 0 10px 0 var(--mint),var(--shadow)}
.pc-block--con{box-shadow:inset 0 10px 0 var(--rust),var(--shadow)}

/* Forms */
.field-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,170px),1fr));gap:var(--sp-3)}
.field{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
.field label{font-weight:800;font-size:.9rem}
.field input,.field select,.field textarea{width:100%;min-width:0;padding:11px var(--sp-3);font:inherit;font-size:1rem;font-weight:600;color:var(--ink);background:#fff;border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);box-shadow:2px 2px 0 var(--ink);transition:box-shadow .2s ease,transform .2s var(--bounce),background-color .15s ease}
.field input:hover,.field select:hover,.field textarea:hover{background:#fffbea}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:none;background:#fff;box-shadow:0 0 0 4px var(--sky),4px 4px 0 var(--ink);transform:translate(-1px,-1px)}
.field textarea{resize:vertical;min-height:140px}
.field-hint{font-size:.85rem;font-weight:600;color:var(--brown-soft);margin:0;padding:10px 12px;background:var(--beige);border:2px dashed rgba(31,27,46,.45);border-radius:var(--radius-sm)}
.field .field-hint{background:transparent;padding:0;border:0}
.field-error{margin:0;font-size:.875rem;font-weight:800;color:var(--rust-deep)}
.is-invalid{border:var(--stroke) solid var(--rust-deep) !important;background:var(--pink-light) !important;color:var(--ink)}
input[type="checkbox"].is-invalid{outline:3px solid var(--rust-deep);outline-offset:2px}
.check{display:flex;align-items:flex-start;gap:var(--sp-2);font-size:.9rem;font-weight:600}
.check input{width:20px;height:20px;margin-top:2px;flex:0 0 auto;accent-color:var(--rust)}
.check input:focus-visible{outline:3px dashed var(--grape);outline-offset:2px}
.form-success{padding:var(--sp-3);background:var(--sage-light);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);font-weight:800}
.contact-card .card-body > .btn{align-self:flex-start}

/* Contact */
.contact-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:var(--sp-5);align-items:start}
.contact-layout > *{min-width:0}
.contact-details{display:flex;flex-direction:column;gap:var(--sp-4)}
.contact-address{line-height:1.7;overflow-wrap:anywhere}
.map-block{position:relative;aspect-ratio:4/3;border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);background:linear-gradient(0deg,rgba(31,27,46,.08) 2px,transparent 2px) 0 0/28px 28px,linear-gradient(90deg,rgba(31,27,46,.08) 2px,transparent 2px) 0 0/28px 28px,#c9f5df;color:var(--ink);overflow:hidden}
.map-roads{position:absolute;inset:0;width:100%;height:100%}
.map-roads path{stroke:#ffffff}
.map-roads path:first-child{stroke:var(--sky);opacity:1}
.map-pin{position:absolute;left:44%;top:40%;width:30px;height:30px;background:var(--rust);border:3px solid var(--ink);border-radius:50% 50% 50% 0;transform:rotate(-45deg);box-shadow:-3px 3px 0 var(--ink);animation:pinBob 2.4s ease-in-out infinite}
@keyframes pinBob{0%,100%{transform:rotate(-45deg) translate(0,0)}50%{transform:rotate(-45deg) translate(4px,-4px)}}
.map-label{position:absolute;left:var(--sp-3);bottom:var(--sp-3);padding:4px 12px;background:var(--sun);color:var(--ink);font-family:var(--serif);font-size:.8rem;font-weight:800;border:2px solid var(--ink);border-radius:var(--radius-pill);box-shadow:2px 2px 0 var(--ink);max-width:calc(100% - 32px);overflow-wrap:anywhere}
.map-link{margin:0;font-weight:700}

/* Footer */
.site-footer{position:relative;margin-top:calc(var(--sp-6) + 18px);background:var(--ink);color:#e9e5ff;padding:var(--sp-6) 0 var(--sp-4)}
.site-footer::before{content:"";position:absolute;left:0;right:0;top:-17px;height:18px;background:radial-gradient(circle at 50% 100%,var(--ink) 12px,transparent 12.5px) 0 0/28px 18px repeat-x}
.site-footer a{color:var(--sun)}
.site-footer a:hover{color:var(--pink)}
.site-footer a:focus-visible{outline-color:var(--sun)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:var(--sp-5)}
.footer-grid > *{min-width:0}
.brand--footer{color:var(--paper);margin-bottom:var(--sp-3)}
.brand--footer:hover{color:var(--sun)}
.footer-brand p{font-size:.9rem;margin:0}
.footer-heading{display:inline-block;font-size:1rem;color:var(--ink);background:var(--mint);margin-bottom:var(--sp-3);padding:3px 12px;border:2px solid var(--paper);border-radius:var(--radius-pill);transform:rotate(-2deg)}
.footer-col:nth-child(3) .footer-heading{background:var(--sky)}
.footer-col:nth-child(4) .footer-heading{background:var(--pink)}
.footer-links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--sp-2);font-size:.9rem}
.footer-address{font-size:.9rem;line-height:1.7;overflow-wrap:anywhere}
.footer-bottom{margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:2px dashed rgba(233,229,255,.35);font-size:.85rem}
.footer-bottom p{margin:0}

/* Cookie banner */
.cookie-banner{position:fixed;left:var(--sp-3);right:var(--sp-3);bottom:var(--sp-3);z-index:100;max-width:960px;margin:0 auto;background:var(--paper);color:var(--ink);border:var(--stroke) solid var(--ink);border-radius:var(--radius);box-shadow:inset 0 10px 0 var(--sun),var(--shadow-lg);animation:popIn .4s var(--bounce) both}
.cookie-inner{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-4);padding-top:calc(var(--sp-4) + 8px)}
.cookie-text{margin:0;font-size:.95rem;font-weight:600}
.cookie-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
.cookie-prefs{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);padding:var(--sp-3);background:var(--beige);color:var(--ink);border:2px dashed var(--ink);border-radius:var(--radius-sm)}

/* Responsive */
@media (max-width:959px){
  .article-layout,.contact-layout{grid-template-columns:minmax(0,1fr)}
  .article-aside{position:static}
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-head,.section-head{grid-template-columns:minmax(0,1fr);gap:var(--sp-3)}
  .hero-dek{transform:none}
}
@media (max-width:600px){
  .container{padding:0 var(--sp-3)}
  .article-head::after{left:var(--sp-3)}
  .footer-grid{grid-template-columns:minmax(0,1fr)}
  .card-body{padding:var(--sp-4) var(--sp-3)}
  .stat{padding:var(--sp-3)}
  .cookie-actions .btn{flex:1 1 auto}
  .article-figure{transform:none}
  .hero{background:radial-gradient(900px 420px at 80% -10%,rgba(92,200,255,.35),rgba(255,244,214,0) 70%)}
}
@media (max-width:399px){
  body{font-size:1rem}
  .header-inner{padding:0 12px;gap:var(--sp-2)}
  .brand{font-size:1rem;gap:6px}
  .brand-mark{width:24px;height:24px}
  .header-cta{padding:5px 10px;font-size:.8rem}
  .nav-toggle{width:38px;height:38px}
  .stat-value{font-size:1.15rem}
  .cookie-banner{left:var(--sp-2);right:var(--sp-2);bottom:var(--sp-2)}
  .cookie-inner{padding:var(--sp-3);padding-top:calc(var(--sp-3) + 8px)}
  .result-row{flex-wrap:wrap}
  .result-row dd{text-align:left}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}