:root{
  --teal:#004056; --teal-soft:#0C566D;
  --green:#8EBD22; --green-d:#5B7E0D; --pist-5:#EEF4DC;
  --cyan:#00808D; --cyan-50:#16BEC4;
  --paper:#F4F6EC; --paper-2:#FBFCF7; --sand:#ECEAE0;
  --ink:#0C2230; --muted:#5E7682; --line:#E2E6D6;
  --violet:#900EC2;
  --display:"Mona Sans",-apple-system,sans-serif;
  --body:"Inter",-apple-system,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:88px;}
body{font-family:var(--body);background:var(--paper-2);color:var(--ink);-webkit-font-smoothing:antialiased;font-feature-settings:"ss01";line-height:1.6;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}

.wrap{max-width:1240px;margin:0 auto;padding:0 48px;}

.eyebrow{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--green-d);display:inline-flex;align-items:center;gap:10px;}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green);}
.eyebrow.on-teal{color:var(--green);}
.eyebrow.on-teal::before{background:var(--green);}

/* ===== dot system ===== */
.dotfield{background-image:radial-gradient(var(--dotcol,var(--green)) 28%,transparent 32%);background-size:var(--dotgap,13px) var(--dotgap,13px);background-position:center;}
/* keep a small inset so the mask never slices edge dots in half */
.shape{-webkit-mask-size:90% auto;mask-size:90% auto;}
.shape{-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;}
.shape-10{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120'><text x='100' y='104' font-family='Arial' font-size='150' font-weight='900' text-anchor='middle'>10</text></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120'><text x='100' y='104' font-family='Arial' font-size='150' font-weight='900' text-anchor='middle'>10</text></svg>");}
.shape-arrow{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M50 8 L88 50 L66 50 L66 92 L34 92 L34 50 L12 50 Z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M50 8 L88 50 L66 50 L66 92 L34 92 L34 50 L12 50 Z'/></svg>");}
.shape-heart{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M50 86 C16 62 6 42 6 28 C6 14 17 6 28 6 C38 6 46 12 50 22 C54 12 62 6 72 6 C83 6 94 14 94 28 C94 42 84 62 50 86 Z'/></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><path d='M50 86 C16 62 6 42 6 28 C6 14 17 6 28 6 C38 6 46 12 50 22 C54 12 62 6 72 6 C83 6 94 14 94 28 C94 42 84 62 50 86 Z'/></svg>");}
/* connection mark: three petals around a centre */
.shape-conn{-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g fill='black'><circle cx='50' cy='26' r='18'/><circle cx='29' cy='64' r='18'/><circle cx='71' cy='64' r='18'/></g></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><g fill='black'><circle cx='50' cy='26' r='18'/><circle cx='29' cy='64' r='18'/><circle cx='71' cy='64' r='18'/></g></svg>");}

/* signature arch */
.arch{border-radius:999px 999px 26px 26px;overflow:hidden;position:relative;background:var(--sand);}
.arch img{width:100%;height:100%;object-fit:cover;}
.arch.duo img{filter:saturate(.5);}
.arch.duo::after{content:"";position:absolute;inset:0;background:var(--cyan);mix-blend-mode:color;opacity:.6;}
.arch.duo::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,transparent 55%,rgba(0,64,86,.45));}

/* ===================== NAV ===================== */
.nav{position:sticky;top:0;z-index:100;background:rgba(251,252,247,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.nav-inner{max-width:1320px;margin:0 auto;padding:14px 40px;display:flex;align-items:center;gap:20px;overflow:hidden;}
.nav-brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:17px;color:var(--teal);letter-spacing:-.01em;}
.nav-brand img{width:28px;height:28px;object-fit:contain;}
.nav-links{display:flex;gap:1px;margin-left:auto;flex:1;min-width:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;justify-content:flex-end;}
.nav-links::-webkit-scrollbar{display:none;}
.nav-links a{white-space:nowrap;}
.nav-links a{font-size:12.5px;font-weight:500;color:var(--muted);padding:8px 9px;border-radius:999px;transition:.15s;}
.nav-links a:hover{color:var(--teal);background:var(--paper);}
.nav-links a.active{color:var(--teal);background:var(--green);color:#1F2F04;font-weight:600;}
.nav-ver{display:none;}
.nav-print{appearance:none;border:1.5px solid var(--teal);background:none;color:var(--teal);font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.08em;padding:7px 14px;border-radius:999px;cursor:pointer;transition:.15s;flex-shrink:0;}
.nav-print:hover{background:var(--teal);color:#fff;}

/* hamburger — hidden on wide screens */
.nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:40px;border:1.5px solid var(--line);border-radius:11px;background:none;cursor:pointer;flex-shrink:0;padding:0 11px;}
.nav-burger span{display:block;height:2px;border-radius:2px;background:var(--teal);transition:.2s;}
.nav.open .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav.open .nav-burger span:nth-child(2){opacity:0;}
.nav.open .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media (max-width:1180px){
  .nav-links{position:absolute;top:100%;right:0;left:0;flex-direction:column;flex-wrap:nowrap;max-height:0;overflow:hidden;background:rgba(251,252,247,.98);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:0 40px;gap:0;justify-content:flex-start;transition:max-height .28s ease,padding .28s ease;box-shadow:0 24px 40px -28px rgba(0,64,86,.4);}
  .nav.open .nav-links{max-height:82vh;padding:10px 40px 18px;overflow-y:auto;}
  .nav-links a{font-size:15px;padding:12px 14px;width:100%;border-radius:10px;}
  .nav-burger{display:flex;}
  .nav-inner{position:relative;overflow:visible;}
}

/* asset downloads */
.asset-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px;}
.asset-dl{display:flex;align-items:center;gap:12px;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 14px;text-decoration:none;transition:.14s;}
.asset-dl:hover{background:#fff;border-color:var(--green);transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(0,64,86,.35);}
.asset-dl .adot{width:11px;height:11px;border-radius:50%;flex-shrink:0;}
.asset-dl b{display:block;font-family:var(--display);font-weight:700;font-size:14px;color:var(--teal);line-height:1.2;}
.asset-dl div span{font-family:var(--mono);font-size:10.5px;color:var(--muted);letter-spacing:.02em;}
.asset-dl .dlico{margin-left:auto;font-size:16px;color:var(--green-d);font-weight:700;}

/* ===================== COVER ===================== */
.cover{position:relative;overflow:hidden;background:linear-gradient(170deg,var(--paper) 0%,var(--paper-2) 60%);}
.cover .ring{position:absolute;border-radius:50%;pointer-events:none;}
.cover .ring.a{width:540px;height:540px;background:var(--green);right:-130px;top:-150px;}
.cover .ring.b{width:280px;height:280px;background:var(--cyan);opacity:.10;left:50%;bottom:-90px;}
.cover-conn{position:absolute;left:5%;top:30%;width:120px;height:120px;--dotcol:var(--cyan);--dotgap:13px;opacity:.5;}
.cover-inner{max-width:1320px;margin:0 auto;padding:80px 40px 90px;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;position:relative;z-index:2;}
.cover h1{font-family:var(--display);font-weight:800;font-size:clamp(60px,8.5vw,128px);line-height:.84;letter-spacing:-.045em;color:var(--teal);margin:20px 0 26px;}
.cover h1 em{font-style:normal;color:var(--green-d);}
.cover-sub{font-size:19px;line-height:1.5;color:var(--ink);max-width:42ch;margin-bottom:36px;}
.cover-meta{display:flex;gap:40px;}
.cover-meta .k{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--green-d);margin-bottom:5px;}
.cover-meta .v{font-size:14px;font-weight:600;color:var(--teal);}
.cover-hero{position:relative;aspect-ratio:4/5;}
.cover-hero .arch{position:absolute;inset:0;box-shadow:0 40px 90px -44px rgba(0,64,86,.55);}
.cover-hero .arch::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(0,64,86,.5));}
.cover-ten{position:absolute;left:-40px;bottom:40px;width:220px;height:140px;--dotcol:var(--green);--dotgap:15px;z-index:3;}

/* ===================== SECTION ===================== */
.sec{padding:104px 0;}
.sec.sand{background:var(--sand);}
.sec.teal{background:var(--teal);color:#fff;}
.sec-head{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;margin-bottom:64px;}
.sec h2{font-family:var(--display);font-weight:800;font-size:clamp(40px,5.2vw,72px);line-height:.92;letter-spacing:-.04em;color:var(--teal);margin-top:16px;text-wrap:balance;}
.sec.teal h2{color:#fff;}
.lede{font-size:19px;line-height:1.55;color:var(--ink);max-width:48ch;}
.lede.on-teal{color:#CFE1E8;}
.block-title{font-family:var(--display);font-weight:800;font-size:26px;letter-spacing:-.02em;color:var(--teal);margin:64px 0 24px;}
.sec.teal .block-title{color:#fff;}
.foot-note{font-size:13px;color:var(--muted);margin-top:18px;}

/* story */
.story-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;}
.claim-card{position:relative;overflow:hidden;background:var(--teal);color:#fff;border-radius:26px;padding:44px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 30px 60px -36px rgba(0,64,86,.5);}
.claim-big{font-family:var(--display);font-weight:800;font-size:clamp(36px,4vw,56px);line-height:.95;letter-spacing:-.03em;margin:14px 0 16px;}
.claim-card p{color:#CFE1E8;font-size:15.5px;max-width:34ch;}
.claim-ten{position:absolute;right:-20px;top:-10px;width:150px;height:95px;--dotcol:rgba(255,255,255,.16);--dotgap:13px;}
.values{display:flex;flex-direction:column;gap:14px;}
.val{display:flex;gap:18px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 14px 30px -22px rgba(0,64,86,.25);}
.val b{font-family:var(--display);font-size:19px;color:var(--teal);letter-spacing:-.01em;}
.val p{font-size:14.5px;color:var(--muted);margin-top:4px;}
.val-ic{flex-shrink:0;width:48px;height:48px;border-radius:14px;background:var(--paper);display:grid;place-items:center;}

/* contrast */
.contrast{display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;}
.contrast-card{border-radius:26px;padding:36px;position:relative;overflow:hidden;}
.contrast-card.from{background:#fff;border:1px solid var(--line);}
.contrast-card.to{background:var(--teal);color:#fff;box-shadow:0 30px 60px -36px rgba(0,64,86,.5);}
.contrast-card h3{font-family:var(--display);font-weight:800;font-size:32px;letter-spacing:-.03em;color:var(--teal);margin:12px 0 10px;}
.contrast-card.to h3{color:#fff;}
.contrast-card p{font-size:15px;color:var(--muted);max-width:34ch;}
.contrast-card.to p{color:#CFE1E8;}
.metrics{display:flex;gap:24px;margin-top:24px;}
.metrics b{font-family:var(--display);font-size:34px;font-weight:800;color:var(--green);letter-spacing:-.03em;display:block;line-height:1;}
.metrics.light b{color:var(--green);}
.metrics span{font-size:11px;color:var(--muted);}
.metrics.light span{color:#9FBDC6;}
.contrast-arrow{width:56px;height:56px;color:var(--green);}
.contrast-arrow .dotfield{width:100%;height:100%;--dotcol:var(--green);--dotgap:9px;}

/* ladder */
.ladder{display:flex;flex-direction:column;gap:10px;}
.lad{display:grid;grid-template-columns:48px 1.1fr 2fr auto;gap:24px;align-items:center;padding:20px 28px;border-radius:16px;background:#fff;border:1px solid var(--line);}
.lad .n{font-family:var(--mono);font-size:13px;font-weight:700;color:var(--muted);}
.lad .nm{font-family:var(--display);font-weight:700;font-size:21px;letter-spacing:-.02em;color:var(--teal);}
.lad .bar{height:8px;border-radius:8px;background:var(--paper);overflow:hidden;}
.lad .bar i{display:block;height:100%;background:var(--green-d);opacity:.5;}
.lad .t{font-family:var(--display);font-weight:700;font-size:18px;color:var(--green-d);text-align:right;}
.lad.norm{background:var(--teal);border-color:var(--teal);}
.lad.norm .n{color:var(--cyan-50);}
.lad.norm .nm{color:#fff;}
.lad.norm .bar{background:rgba(255,255,255,.16);}
.lad.norm .bar i{background:var(--green);opacity:1;}
.lad.norm .t{color:var(--green);}

/* logo */
.logo-stage{position:relative;background:#fff;border:1px solid var(--line);border-radius:26px;padding:80px;display:grid;place-items:center;box-shadow:0 20px 50px -34px rgba(0,64,86,.3);}
.logo-main{display:flex;align-items:center;gap:22px;}
.logo-main img{width:80px;height:80px;object-fit:contain;}
.logo-word{font-family:var(--display);font-weight:800;font-size:42px;letter-spacing:-.02em;color:var(--teal);}
.clear-note{position:absolute;left:28px;bottom:20px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.logo-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px;}
.logo-tile{border-radius:18px;padding:40px 20px 18px;display:flex;flex-direction:column;align-items:center;gap:18px;border:1px solid var(--line);}
.logo-tile img{width:56px;height:56px;object-fit:contain;}
.logo-tile span{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.logo-tile.light{background:#fff;}
.logo-tile.teal{background:var(--teal);}.logo-tile.teal span{color:#9FBDC6;}
.logo-tile.green{background:var(--green);}.logo-tile.green span{color:#3E5413;}
.logo-tile.photo{background:url(assets/photo-corridor.jpg) center/cover;}.logo-tile.photo span{color:#fff;}
.logo-tile.photo img{background:rgba(255,255,255,.0);}
.dont-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:16px;}
.dont-demo{height:120px;border-radius:14px;background:var(--paper);display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);}
.dont-demo img{width:54px;height:54px;object-fit:contain;}
.dont-demo.squish img{width:90px;height:40px;object-fit:fill;}
.dont-demo.rot img{transform:rotate(24deg);}
.dont-demo.crop img{width:90px;height:90px;object-fit:cover;border-radius:50%;}
.dont-demo.busy{background:linear-gradient(45deg,#ff7a7a,#ffd36b);}
.dont span{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--muted);margin-top:10px;}
.dont i{font-style:normal;color:#c0392b;font-weight:700;}

/* color */
.swatch-row{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.sw{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;}
.sw .chip{display:block;height:88px;border-radius:12px;background:var(--c);margin-bottom:16px;}
.sw b{font-family:var(--display);font-size:16px;color:var(--teal);letter-spacing:-.01em;}
.sw .hex{display:block;font-family:var(--mono);font-size:12px;color:var(--muted);margin:3px 0 8px;}
.sw .role{font-size:12px;color:var(--muted);}
.tint-block{margin-top:32px;}
.tint-label{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;}
.tints{display:flex;border-radius:14px;overflow:hidden;border:1px solid var(--line);}
.tints span{flex:1;height:64px;display:grid;place-items:center;font-family:var(--mono);font-size:12px;color:#3E5413;}
.ratio{margin-top:32px;}
.ratio-bar{display:flex;height:60px;border-radius:12px;overflow:hidden;}
.ratio-bar span{display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:600;}

/* type */
.type-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:24px;}
.type-spec{background:var(--teal);color:#fff;border-radius:24px;padding:40px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;}
.type-spec .ag{font-family:var(--display);font-weight:800;font-size:160px;line-height:.8;letter-spacing:-.04em;color:var(--green);}
.type-spec b{font-family:var(--display);font-size:28px;letter-spacing:-.02em;}
.type-spec span{display:block;font-family:var(--mono);font-size:12px;color:#9FBDC6;margin-top:4px;}
.type-spec .weights{display:flex;gap:18px;margin-top:16px;font-family:var(--display);font-size:30px;}
.type-scale{background:#fff;border:1px solid var(--line);border-radius:24px;padding:16px 36px;display:flex;flex-direction:column;justify-content:center;}
.ts{display:grid;grid-template-columns:80px 1fr;gap:24px;align-items:baseline;padding:18px 0;border-bottom:1px dashed var(--line);}
.ts:last-child{border-bottom:none;}
.ts .lbl{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.ts .pv{color:var(--teal);font-family:var(--display);line-height:1.1;}

/* dot system showcase */
.sys-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.sys-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:20px;overflow:hidden;}
.sys-card .canvas{height:180px;display:grid;place-items:center;}
.sys-card .field{width:70%;height:64%;}
.sys-card .cap{padding:16px 20px;display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid rgba(255,255,255,.12);}
.sys-card .cap b{font-family:var(--display);font-size:16px;color:#fff;}
.sys-card .cap span{font-family:var(--mono);font-size:11px;color:var(--green);}
.dot-banner{position:relative;overflow:hidden;margin-top:24px;border-radius:24px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);padding:48px 56px;}
.dot-banner .bg-dots{position:absolute;inset:0;--dotcol:rgba(255,255,255,.08);--dotgap:22px;}
.dot-banner p{position:relative;font-family:var(--display);font-weight:700;font-size:clamp(24px,3vw,40px);line-height:1.05;letter-spacing:-.03em;color:#fff;max-width:24ch;}
.dot-banner em{font-style:normal;color:var(--green);}

/* icons */
.icon-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;}
.ic-tile{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 16px;display:flex;flex-direction:column;align-items:center;gap:14px;box-shadow:0 12px 28px -22px rgba(0,64,86,.3);}
.ic-tile .ic-box{width:56px;height:56px;border-radius:15px;background:var(--paper);display:grid;place-items:center;}
.ic-tile .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;}

/* illustration */
.illu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.illu{display:flex;flex-direction:column;gap:14px;}
.illu-art{height:220px;border-radius:20px;overflow:hidden;position:relative;background:#fff;border:1px solid var(--line);}
.illu span{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.illu-art.rings{background:radial-gradient(circle 92px at 50% 50%,var(--teal) 0 13px,transparent 13px 30px,var(--cyan) 30px 43px,transparent 43px 60px,var(--green) 60px 74px,transparent 74px);background-repeat:no-repeat;}
.illu-art.arch-mini::after{content:"";position:absolute;left:30px;right:30px;bottom:0;top:40px;border-radius:999px 999px 0 0;background:linear-gradient(170deg,var(--green),var(--green-d));}
.illu-art.cluster{background:var(--teal);display:grid;place-items:center;}
.illu-art.halfcircle{background:var(--sand);}
.illu-art.halfcircle::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:var(--cyan);border-radius:999px 999px 0 0;}

/* photography */
.photo-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;}
.photo-hero .arch.big{aspect-ratio:4/3;}
.photo-hero-side{display:grid;grid-template-rows:1fr 1fr;gap:20px;}
.photo-hero-side .arch{aspect-ratio:16/7;}
.photo-row{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:20px;}
.photo-row .arch.s{aspect-ratio:3/4;}
.photo-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px;}
.tag-ok,.tag-no{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.05em;padding:7px 14px;border-radius:999px;}
.tag-ok{background:var(--green);color:#1F2F04;}
.tag-no{background:#fff;border:1px solid var(--line);color:#c0392b;}

/* applications */
.apps{column-count:2;column-gap:20px;}
.app{break-inside:avoid;width:100%;margin-bottom:20px;}
.app.wide{grid-column:auto;}
.app-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;}
.app-head b{font-family:var(--display);font-size:15px;color:var(--teal);}
.app-head span{font-family:var(--mono);font-size:11px;color:var(--muted);}
.canvas-1x1{aspect-ratio:1/1;border-radius:18px;overflow:hidden;box-shadow:0 16px 36px -26px rgba(0,64,86,.4);}
.canvas-9x16{aspect-ratio:9/16;border-radius:18px;overflow:hidden;box-shadow:0 16px 36px -26px rgba(0,64,86,.4);}
/* li quote */
.li-quote{width:100%;height:100%;background:#fff;padding:26px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;}
.li-quote .lq-top{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:700;font-size:13px;color:var(--teal);}
.li-quote .lq-top img{width:20px;height:20px;object-fit:contain;}
.lq-body{position:relative;z-index:2;}
.lq-body .qm{font-family:var(--display);font-size:60px;line-height:.4;color:var(--green);font-weight:800;display:block;margin-bottom:8px;}
.lq-body h4{font-family:var(--display);font-weight:700;font-size:24px;line-height:1.05;letter-spacing:-.025em;color:var(--teal);}
.lq-foot{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:12px;font-size:11px;color:var(--muted);}
.lq-foot b{color:var(--teal);}
.lq-dots{position:absolute;right:-16px;bottom:30px;width:120px;height:120px;--dotcol:rgba(142,189,34,.18);--dotgap:13px;}
/* ig */
.ig{width:100%;height:100%;background:linear-gradient(180deg,#fff,var(--paper));padding:22px;display:flex;flex-direction:column;gap:16px;position:relative;}
.ig-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:10px;color:var(--green-d);}
.ig-top img{width:22px;height:22px;object-fit:contain;}
.ig-arch{flex:1;border-radius:200px 200px 18px 18px;}
.ig-body h4{font-family:var(--display);font-weight:800;font-size:26px;line-height:.98;letter-spacing:-.03em;color:var(--teal);margin-top:8px;}
.ig-cta{align-self:flex-start;background:var(--teal);color:#fff;border-radius:999px;padding:10px 18px;font-size:13px;font-weight:600;}
/* newsletter */
.nl{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;}
.nl-head{background:var(--paper);border-bottom:3px solid var(--green);padding:18px 24px;display:flex;justify-content:space-between;align-items:center;}
.nl-lg{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:800;font-size:16px;color:var(--teal);}
.nl-lg img{width:24px;height:24px;object-fit:contain;}
.nl-iss{font-family:var(--mono);font-size:11px;color:var(--green-d);}
.nl-hero{padding:28px 24px;border-bottom:1px solid var(--line);}
.nl-hero h4{font-family:var(--display);font-weight:800;font-size:26px;line-height:1;letter-spacing:-.03em;color:var(--teal);margin:8px 0 10px;}
.nl-hero p{font-size:14px;color:var(--muted);margin-bottom:16px;}
.nl-btn{display:inline-block;background:var(--green);color:#1F2F04;font-weight:700;font-size:13px;padding:10px 18px;border-radius:999px;}
.nl-item{display:flex;gap:16px;align-items:center;padding:20px 24px;}
.nl-thumb{width:54px;height:54px;border-radius:12px;background:var(--paper);display:grid;place-items:center;flex-shrink:0;}
.nl-item b{font-family:var(--display);font-size:16px;color:var(--teal);}
.nl-item p{font-size:13px;color:var(--muted);margin-top:2px;}
/* signature */
.sig{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;gap:18px;align-items:center;}
.sig-av{width:64px;height:64px;border-radius:50%;background:linear-gradient(140deg,var(--cyan),var(--teal));color:#fff;display:grid;place-items:center;font-family:var(--display);font-weight:800;font-size:24px;flex-shrink:0;}
.sig-info{display:flex;flex-direction:column;gap:2px;}
.sig-info b{font-family:var(--display);font-size:18px;color:var(--teal);}
.sig-info .role{font-size:12px;color:var(--muted);margin-bottom:8px;}
.sig-lg{display:flex;align-items:center;gap:7px;font-weight:700;font-size:13px;color:var(--teal);}
.sig-lg img{width:16px;height:16px;object-fit:contain;}
.sig-ln{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:6px;}

/* ===== more applications ===== */
.more-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;align-items:start;}
.mock-cap{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;}
.mock-cap b{font-family:var(--display);font-size:15px;color:var(--teal);}
.mock-cap span{font-family:var(--mono);font-size:11px;color:var(--muted);}
/* browser */
.browser{border-radius:16px;overflow:hidden;border:1px solid var(--line);box-shadow:0 24px 50px -30px rgba(0,64,86,.4);background:#fff;}
.br-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;background:var(--paper);border-bottom:1px solid var(--line);}
.br-bar i{width:9px;height:9px;border-radius:50%;background:var(--line);}
.br-url{margin-left:12px;flex:1;height:22px;border-radius:6px;background:#fff;border:1px solid var(--line);display:flex;align-items:center;padding:0 10px;font-family:var(--mono);font-size:10px;color:var(--muted);}
.br-view{position:relative;overflow:hidden;background:linear-gradient(170deg,var(--paper),#fff);padding:30px 34px;min-height:300px;}
.br-nav{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;color:var(--teal);font-size:15px;margin-bottom:30px;}
.br-nav img{width:22px;height:22px;object-fit:contain;}
.br-nav .sp{flex:1;}
.br-nav a{font-size:11px;color:var(--muted);font-weight:500;}
.br-nav .b{background:var(--green);color:#1F2F04;padding:6px 12px;border-radius:999px;font-size:11px;font-weight:700;}
.br-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;}
.br-hero h3{font-family:var(--display);font-weight:800;font-size:34px;line-height:.95;letter-spacing:-.03em;color:var(--teal);}
.br-hero h3 em{font-style:normal;color:var(--green-d);}
.br-hero p{font-size:12.5px;color:var(--muted);margin:10px 0 14px;}
.br-hero .b{display:inline-block;background:var(--green);color:#1F2F04;font-weight:700;font-size:12px;padding:9px 16px;border-radius:999px;}
.br-hero .arch{aspect-ratio:3/4;}
.br-conn{position:absolute;right:24px;bottom:18px;width:90px;height:90px;--dotcol:rgba(0,128,141,.25);--dotgap:11px;}
/* phone */
.phone{width:230px;margin:0 auto;border-radius:34px;background:var(--teal);padding:10px;box-shadow:0 30px 60px -30px rgba(0,64,86,.55);}
.phone-scr{border-radius:26px;overflow:hidden;background:var(--paper-2);height:430px;display:flex;flex-direction:column;}
.ph-top{background:var(--teal);color:#fff;padding:16px 18px 18px;border-radius:0 0 20px 20px;}
.ph-top .row{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:9px;color:#9FBDC6;margin-bottom:12px;}
.ph-top .row img{width:18px;height:18px;object-fit:contain;filter:brightness(0) invert(1);}
.ph-top h4{font-family:var(--display);font-weight:800;font-size:20px;letter-spacing:-.02em;}
.ph-top .min{display:inline-flex;align-items:center;gap:6px;background:rgba(142,189,34,.22);color:var(--green);font-family:var(--mono);font-size:10px;font-weight:700;padding:5px 10px;border-radius:999px;margin-top:8px;}
.ph-list{padding:14px;display:flex;flex-direction:column;gap:9px;overflow:hidden;}
.ph-task{background:#fff;border:1px solid var(--line);border-radius:13px;padding:11px 12px;display:flex;gap:10px;align-items:center;}
.ph-task .ck{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--line);flex-shrink:0;}
.ph-task.done .ck{background:var(--green);border-color:var(--green);}
.ph-task .tt{font-size:11.5px;font-weight:600;color:var(--teal);}
.ph-task .ts{font-size:9.5px;color:var(--muted);}
.ph-task.done .tt{color:var(--muted);text-decoration:line-through;}
/* banners */
.banner-row{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-top:24px;align-items:start;}
.beurs{position:relative;overflow:hidden;border-radius:18px;background:var(--teal);color:#fff;aspect-ratio:3/1;display:flex;align-items:center;padding:0 44px;box-shadow:0 24px 50px -32px rgba(0,64,86,.5);}
.beurs .arch{position:absolute;right:36px;top:50%;transform:translateY(-50%);width:30%;height:128%;}
.beurs .bg{position:absolute;inset:0;--dotcol:rgba(255,255,255,.07);--dotgap:20px;}
.beurs-c{position:relative;z-index:2;max-width:60%;}
.beurs-c .eyebrow{color:var(--green);}.beurs-c .eyebrow::before{background:var(--green);}
.beurs-c h3{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.6vw,52px);line-height:.92;letter-spacing:-.035em;margin:12px 0 0;}
.beurs-c h3 em{font-style:normal;color:var(--green);}
.rollup{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(180deg,#fff,var(--paper));aspect-ratio:1/1.55;padding:30px 26px;display:flex;flex-direction:column;border:1px solid var(--line);box-shadow:0 24px 50px -32px rgba(0,64,86,.4);}
.rollup .lg{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;font-size:14px;color:var(--teal);}
.rollup .lg img{width:24px;height:24px;object-fit:contain;}
.rollup h3{font-family:var(--display);font-weight:800;font-size:30px;line-height:.95;letter-spacing:-.03em;color:var(--teal);margin:22px 0 0;}
.rollup h3 em{font-style:normal;color:var(--green-d);}
.rollup .arch{margin-top:20px;aspect-ratio:3/2;border-radius:999px 999px 18px 18px;}
.rollup .ten{position:absolute;right:18px;top:120px;width:84px;height:54px;--dotcol:rgba(142,189,34,.5);--dotgap:11px;}
/* small format row */
.small-row{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:24px;}
.small-row.two{grid-template-columns:1.4fr 1fr;}
.masonry{column-count:2;column-gap:24px;margin-top:24px;}
.masonry>div{break-inside:avoid;width:100%;margin:0 0 24px;}
.ad{border-radius:16px;overflow:hidden;border:1px solid var(--line);box-shadow:0 18px 40px -28px rgba(0,64,86,.35);}
.ad.rect{aspect-ratio:6/5;background:var(--green);position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:24px;}
.ad.rect h4{font-family:var(--display);font-weight:800;font-size:26px;line-height:.96;letter-spacing:-.03em;color:#1F2F04;}
.ad.rect .b{align-self:flex-start;background:var(--teal);color:#fff;font-size:12px;font-weight:700;padding:9px 16px;border-radius:999px;}
.ad.rect .dots{position:absolute;right:-10px;bottom:-10px;width:120px;height:120px;--dotcol:rgba(31,47,4,.16);--dotgap:13px;}
.li-cover{aspect-ratio:4/1;background:var(--teal);position:relative;overflow:hidden;display:flex;align-items:center;padding:0 26% 0 40px;color:#fff;}
.li-cover .bg{position:absolute;inset:0;--dotcol:rgba(255,255,255,.07);--dotgap:18px;}
.li-cover h4{position:relative;font-family:var(--display);font-weight:800;font-size:clamp(20px,2.4vw,34px);letter-spacing:-.03em;line-height:1;}
.li-cover h4 em{font-style:normal;color:var(--green);}
.li-cover .arch{position:absolute;right:0;top:0;transform:none;width:22%;height:100%;border-radius:0;}
.ad.square{aspect-ratio:1/1;background:#fff;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:24px;}
.ad.square .lg{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;font-size:13px;color:var(--teal);}
.ad.square .lg img{width:22px;height:22px;object-fit:contain;}
.ad.square h4{font-family:var(--display);font-weight:800;font-size:24px;line-height:.98;letter-spacing:-.03em;color:var(--teal);}
.ad.square h4 em{font-style:normal;color:var(--green-d);}
.ad.square .dots{position:absolute;right:16px;top:60px;width:90px;height:58px;--dotcol:rgba(142,189,34,.45);--dotgap:11px;}

/* ===== extra formats + animation ===== */
.fmt-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:24px;align-items:start;}
/* animated dots forming the 10 */
.anim-card{background:var(--teal);border-radius:22px;padding:40px;color:#fff;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:300px;}
.anim-card .eyebrow{color:var(--green);}.anim-card .eyebrow::before{background:var(--green);}
.anim-card h3{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:-.03em;line-height:1;margin-top:12px;max-width:16ch;}
.anim-card p{color:#9FBDC6;font-size:13px;margin-top:10px;}
.anim-stage{position:absolute;right:34px;top:50%;transform:translateY(-50%);width:230px;height:150px;}
.anim-10{position:absolute;inset:0;--dotcol:var(--green);background-image:radial-gradient(var(--dotcol) 28%,transparent 32%);-webkit-mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120'><text x='100' y='104' font-family='Arial' font-size='150' font-weight='900' text-anchor='middle'>10</text></svg>");mask-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120'><text x='100' y='104' font-family='Arial' font-size='150' font-weight='900' text-anchor='middle'>10</text></svg>");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;animation:gather 3.4s ease-in-out infinite alternate;}
@keyframes gather{0%{background-size:44px 44px;opacity:.2;}55%{background-size:13px 13px;opacity:1;}100%{background-size:13px 13px;opacity:1;}}
@media (prefers-reduced-motion:reduce){.anim-10{animation:none;background-size:13px 13px;opacity:1;}}
/* powerpoint slide */
.ppt{aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:linear-gradient(160deg,var(--paper),#fff);border:1px solid var(--line);box-shadow:0 24px 50px -32px rgba(0,64,86,.4);position:relative;display:grid;grid-template-columns:1.2fr .8fr;}
.ppt-l{padding:36px;display:flex;flex-direction:column;justify-content:center;}
.ppt-l .lg{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;font-size:13px;color:var(--teal);margin-bottom:auto;}
.ppt-l .lg img{width:22px;height:22px;object-fit:contain;}
.ppt-l h3{font-family:var(--display);font-weight:800;font-size:32px;line-height:.95;letter-spacing:-.03em;color:var(--teal);}
.ppt-l h3 em{font-style:normal;color:var(--green-d);}
.ppt-l .sub{font-size:12px;color:var(--muted);margin-top:10px;}
.ppt-r{position:relative;}
.ppt-r .arch{position:absolute;inset:18px;border-radius:160px 160px 14px 14px;}
/* billboard / abri */
.abri{aspect-ratio:3/4;border-radius:18px;overflow:hidden;position:relative;background:var(--green);box-shadow:0 24px 50px -32px rgba(31,47,4,.4);}
.abri .arch{position:absolute;left:18px;right:18px;top:18px;height:42%;border-radius:200px 200px 16px 16px;}
.abri-c{position:absolute;left:0;right:0;bottom:0;padding:26px;}
.abri-c h3{font-family:var(--display);font-weight:800;font-size:26px;line-height:.94;letter-spacing:-.03em;color:#1F2F04;}
.abri-c .lg{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;font-size:13px;color:#1F2F04;margin-top:14px;}
.abri-c .lg img{width:22px;height:22px;object-fit:contain;}
/* badge + lanyard */
.badge-wrap{display:flex;flex-direction:column;align-items:center;}
.lanyard{width:60px;height:80px;background:repeating-linear-gradient(180deg,var(--teal) 0 10px,var(--green) 10px 14px);border-radius:6px 6px 0 0;clip-path:polygon(38% 0,62% 0,100% 100%,0 100%);}
.badge{width:200px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:24px 20px;box-shadow:0 24px 50px -30px rgba(0,64,86,.4);position:relative;overflow:hidden;}
.badge .hole{width:42px;height:9px;border-radius:999px;background:var(--paper);border:1px solid var(--line);margin:0 auto 18px;}
.badge .lg{display:flex;align-items:center;gap:7px;justify-content:center;font-family:var(--display);font-weight:800;font-size:12px;color:var(--teal);}
.badge .lg img{width:20px;height:20px;object-fit:contain;}
.badge .nm{font-family:var(--display);font-weight:800;font-size:24px;color:var(--teal);text-align:center;margin-top:18px;letter-spacing:-.02em;}
.badge .role{text-align:center;font-size:12px;color:var(--muted);margin-top:2px;}
.badge .dots{position:absolute;left:-12px;bottom:-12px;width:80px;height:80px;--dotcol:rgba(142,189,34,.5);--dotgap:11px;}
/* letterhead */
.letter{aspect-ratio:1/1.414;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 24px 50px -30px rgba(0,64,86,.35);padding:24px;position:relative;overflow:hidden;}
.letter .lh{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border-bottom:2px solid var(--green);padding-bottom:14px;}
.letter .lh .lg{display:flex;align-items:center;gap:7px;font-family:var(--display);font-weight:800;font-size:12px;color:var(--teal);flex-shrink:0;}
.letter .lh .lg img{width:20px;height:20px;object-fit:contain;}
.letter .lh .ad{font-family:var(--mono);font-size:7px;color:var(--muted);text-align:right;line-height:1.7;flex-shrink:0;white-space:nowrap;}
.letter .body{margin-top:22px;display:flex;flex-direction:column;gap:7px;}
.letter .body i{display:block;height:7px;border-radius:4px;background:var(--paper);}
.letter .body i:nth-child(1){width:40%;background:var(--line);}
.letter .body i:nth-child(6){width:60%;}
.letter .wm{position:absolute;right:-30px;bottom:-30px;width:180px;height:180px;--dotcol:rgba(0,128,141,.10);--dotgap:15px;}

/* footer */
.foot{background:var(--teal);color:#fff;padding:40px 0;}
.foot-in{display:flex;justify-content:space-between;align-items:center;}
.foot-brand{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:18px;}
.foot-brand img{width:28px;height:28px;object-fit:contain;}
.foot-in span{font-family:var(--mono);font-size:12px;color:#9FBDC6;}

/* ===== co-work interactions ===== */
#cc-toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(20px);background:var(--teal);color:#fff;font-family:var(--mono);font-size:13px;letter-spacing:.04em;padding:12px 20px;border-radius:999px;box-shadow:0 16px 40px -16px rgba(0,64,86,.6);opacity:0;pointer-events:none;transition:.25s;z-index:200;}
#cc-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.sw{transition:transform .12s,box-shadow .12s;}
.sw:hover{transform:translateY(-2px);box-shadow:0 14px 30px -20px rgba(0,64,86,.4);}
.anchor-link{appearance:none;border:none;background:none;cursor:pointer;font-size:.5em;margin-left:.4em;opacity:0;transition:.15s;vertical-align:middle;color:var(--green-d);}
.sec-head h2:hover .anchor-link{opacity:.6;}
.anchor-link:hover{opacity:1!important;}

/* schrijfwijzer */
.voice-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.vcol{background:#fff;border:1px solid var(--line);border-radius:20px;padding:32px;box-shadow:0 14px 30px -22px rgba(0,64,86,.25);}
.vcol.do{border-top:5px solid var(--green);}
.vcol.dont{border-top:5px solid #C0392B;}
.vcol h4{font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.02em;color:var(--teal);margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.vcol h4 i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;font-style:normal;font-weight:800;font-size:14px;}
.vcol.do h4 i{background:var(--green);}
.vcol.dont h4 i{background:#C0392B;}
.words{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;}
.word{font-size:13px;font-weight:600;padding:7px 13px;border-radius:8px;}
.word.w-do{background:var(--pist-5);color:var(--green-d);border:1px solid #DCE8BE;}
.word.w-no{background:#FBE8E8;color:#A73030;text-decoration:line-through;text-decoration-color:rgba(0,0,0,.25);}
.ex{background:var(--paper);border-radius:12px;padding:18px 20px;border-left:3px solid var(--green);font-size:14.5px;line-height:1.55;color:var(--ink);}
.vcol.dont .ex{border-left-color:#C0392B;}
.ex .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:7px;}
.rules{margin-top:24px;background:var(--paper);border-radius:20px;padding:40px 44px;}
.rule{display:grid;grid-template-columns:54px 1fr;gap:24px;padding:20px 0;border-bottom:1px solid var(--line);}
.rule:first-child{padding-top:0;}.rule:last-child{padding-bottom:0;border-bottom:none;}
.rule .rn{font-family:var(--display);font-weight:800;font-size:34px;line-height:.9;color:var(--green-d);letter-spacing:-.03em;}
.rule h5{font-family:var(--display);font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--teal);margin-bottom:5px;}
.rule p{font-size:14.5px;color:var(--muted);line-height:1.55;}
.norm-words{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-top:24px;}
.nw{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:0 14px 30px -24px rgba(0,64,86,.2);}
.nw b{font-family:var(--display);font-weight:700;font-size:16px;color:var(--teal);display:block;margin-bottom:6px;}
.nw .sub{font-size:12px;color:var(--green-d);font-family:var(--mono);letter-spacing:.04em;}
.nw p{font-size:13.5px;color:var(--muted);line-height:1.5;margin-top:8px;}

/* essentials / basics */
.ess-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;}
.ecard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:0 14px 30px -22px rgba(0,64,86,.25);}
.ecard h4{font-family:var(--display);font-weight:700;font-size:20px;color:var(--teal);letter-spacing:-.01em;margin-bottom:6px;}
.ecard .ed{font-size:13.5px;color:var(--muted);margin-bottom:22px;}
.fav-row{display:flex;gap:22px;align-items:flex-end;flex-wrap:wrap;}
.fav-row figure{display:flex;flex-direction:column;align-items:center;gap:10px;margin:0;}
.fav-row figcaption{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.05em;}
.appicon{width:84px;height:84px;border-radius:20px;background:var(--teal);display:grid;place-items:center;}
.appicon img{width:50px;height:50px;object-fit:contain;}
.avatar-ic{width:72px;height:72px;border-radius:50%;background:var(--green);display:grid;place-items:center;}
.avatar-ic img{width:42px;height:42px;object-fit:contain;}
.fav32{width:40px;height:40px;border-radius:9px;background:var(--teal);display:grid;place-items:center;}
.fav32 img{width:24px;height:24px;object-fit:contain;}
.fav16{width:24px;height:24px;border-radius:6px;background:var(--teal);display:grid;place-items:center;}
.fav16 img{width:15px;height:15px;object-fit:contain;}
.mods{display:flex;flex-direction:column;gap:12px;}
.mod{display:flex;align-items:center;gap:14px;padding:15px 16px;border-radius:14px;border:1px solid var(--line);}
.mod .mdot{width:14px;height:14px;border-radius:50%;flex-shrink:0;}
.mod b{font-family:var(--display);font-weight:700;font-size:16px;color:var(--teal);}
.mod span{font-size:12.5px;color:var(--muted);display:block;}
.spell{display:flex;flex-direction:column;gap:11px;}
.spell .r{display:flex;gap:12px;align-items:baseline;font-size:14.5px;}
.spell .ok{color:var(--green-d);font-weight:700;flex-shrink:0;}
.spell .no{color:#A73030;text-decoration:line-through;text-decoration-color:rgba(0,0,0,.25);flex-shrink:0;}
.spell .why{color:var(--muted);font-size:12.5px;}
.boiler p{font-size:14.5px;line-height:1.65;color:#2D4754;}
.oneliners{list-style:none;padding:0;margin:16px 0 0;display:flex;flex-direction:column;gap:12px;}
.oneliners li{font-size:14.5px;color:var(--teal);padding-left:16px;border-left:3px solid var(--green);line-height:1.45;}
.oneliners li span{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:3px;}

/* knipoog / humor ads */
.wink-intro{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:40px;}
.wink-rule{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:0 14px 30px -24px rgba(0,64,86,.22);}
.wink-rule b{font-family:var(--display);font-weight:700;font-size:17px;color:var(--teal);display:flex;align-items:center;gap:9px;}
.wink-rule b::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--green);}
.wink-rule p{font-size:13.5px;color:var(--muted);line-height:1.55;margin-top:8px;}
.ad-grid{column-count:3;column-gap:20px;}
.wad{break-inside:avoid;margin-bottom:20px;border-radius:18px;overflow:hidden;position:relative;box-shadow:0 18px 40px -28px rgba(0,64,86,.4);display:flex;flex-direction:column;}
.wad .tag{position:absolute;top:14px;right:14px;font-family:var(--mono);font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.85);color:var(--teal);}
.wad .body{padding:30px 26px;flex:1;display:flex;flex-direction:column;justify-content:space-between;min-height:230px;}
.wad h4{font-family:var(--display);font-weight:800;font-size:27px;line-height:.98;letter-spacing:-.03em;}
.wad .punch{font-size:13px;line-height:1.5;margin-top:14px;opacity:.9;}
.wad .wm{display:flex;align-items:center;gap:7px;margin-top:22px;font-family:var(--display);font-weight:800;font-size:12px;}
.wad .wm img{width:18px;height:18px;object-fit:contain;}
.wad.teal{background:var(--teal);color:#fff;}
.wad.teal h4{color:#fff;}.wad.teal h4 em{font-style:normal;color:var(--green);}
.wad.teal .punch{color:#9FBDC6;}
.wad.green{background:var(--green);color:#1F2F04;}
.wad.green h4 em{font-style:normal;color:#fff;}
.wad.green .punch{color:#2f4406;}
.wad.paper{background:#fff;color:var(--teal);border:1px solid var(--line);}
.wad.paper h4 em{font-style:normal;color:var(--green-d);}
.wad.paper .punch{color:var(--muted);}
.wad .dots{position:absolute;right:-14px;bottom:-14px;width:110px;height:110px;}

@media (max-width:900px){
  .ad-grid{column-count:1;}
  .wink-intro{grid-template-columns:1fr;}
  .nav-links{display:none;}
  .cover-inner,.sec-head,.story-grid,.contrast,.type-grid,.photo-hero{grid-template-columns:1fr;}
  .swatch-row,.logo-row,.dont-row,.sys-grid,.icon-grid,.illu-grid,.photo-row,.apps,.lad{grid-template-columns:1fr 1fr;}
  .contrast-arrow{display:none;}
  .app.wide{grid-column:span 2;}
}

/* ===================== PRINT ===================== */
@media print{
  @page{margin:14mm;}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .nav,.nav-print,#cc-toast,.anchor-link{display:none!important;}
  body{background:#fff;}
  main{padding-top:0;}
  section{page-break-inside:avoid;break-inside:avoid;}
  .sec-head{page-break-after:avoid;}
  .cover{min-height:auto;page-break-after:always;}
  .asset-dl,.sw{box-shadow:none!important;transform:none!important;}
  a{color:inherit;text-decoration:none;}
}