:root{
  --bg:#E4D9BF; --panel:#F6EFDD; --panel2:#EBE1CA; --line:#D3C4A2;
  --text:#2E2A22; --muted:#857C6A; --accent:#C4562F; --accent2:#5F7548;
  --danger:#B23A2E; --warn:#B08D57; --ok:#5F7548; --radius:14px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:-apple-system,Segoe UI,Roboto,Inter,sans-serif;color:var(--text);
  background:#E4D9BF}
/* soft warm paper backdrop behind the whole app (post-login) */
body::before{content:"";position:fixed;inset:0;z-index:-2;
  background:linear-gradient(180deg,#ECE3CE,#E4D9BF 60%,#DED2B4)}
body::after{content:"";position:fixed;inset:0;z-index:-1;
  background:radial-gradient(1100px 700px at 78% -8%,rgba(196,86,47,.10),transparent 58%),
    radial-gradient(900px 600px at 10% 8%,rgba(95,117,72,.08),transparent 60%),
    /* subtle vignette */ radial-gradient(140% 120% at 50% 40%,transparent 60%,rgba(90,70,40,.10))}
a{color:var(--accent);text-decoration:none}
.wrap{max-width:1080px;margin:0 auto;padding:22px 20px 80px}

/* top bar */
.topbar{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.logo{width:38px;height:38px;border-radius:11px;
  background:linear-gradient(135deg,var(--accent),#B08D57);display:grid;place-items:center;
  font-weight:800;font-size:19px;color:#fff;box-shadow:0 6px 22px rgba(196,86,47,.35)}
.logo-img{height:36px;width:auto;cursor:pointer;display:block;
  filter:drop-shadow(0 3px 10px rgba(90,70,40,.28))}
.brand h1{font-size:19px;margin:0}
.brand .tag{color:var(--muted);font-size:12px}
.topbar .spacer{flex:1}
.crumbs{color:var(--muted);font-size:13px}
.crumbs b{color:var(--text)}

/* buttons */
button{font-family:inherit}
.btn{border:none;border-radius:10px;padding:10px 17px;font-size:14px;font-weight:600;
  cursor:pointer;color:#fff;transition:.15s}
.btn.primary{background:linear-gradient(135deg,var(--accent),#A8471F)}
.btn.ghost{background:var(--panel2);border:1px solid var(--line);color:var(--text)}
.btn.danger{background:linear-gradient(135deg,#B23A2E,#C4562F)}
.btn.sm{padding:7px 12px;font-size:13px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:hover:not(:disabled){filter:brightness(1.06)}
.icon-btn{background:var(--panel2);border:1px solid var(--line);color:var(--muted);
  border-radius:8px;cursor:pointer;padding:7px 10px;font-size:14px}
.icon-btn:hover{color:var(--text);border-color:var(--accent)}

/* cards + forms */
.card{background:linear-gradient(180deg,var(--panel),#F1E8D2);border:1px solid var(--line);
  border-radius:var(--radius);padding:20px;box-shadow:0 12px 30px -22px rgba(90,70,40,.5)}
.card h2{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);
  margin:0 0 14px;display:flex;align-items:center;gap:8px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--accent)}
.dot.dst{background:var(--accent2)} .dot.warn{background:var(--warn)}
label{display:block;font-size:12px;color:var(--muted);margin:12px 0 5px}
input,select{width:100%;background:#FBF6E9;border:1px solid var(--line);color:var(--text);
  border-radius:9px;padding:9px 11px;font-size:14px;outline:none}
input:focus,select:focus{border-color:var(--accent)}
.chk{display:flex;align-items:center;gap:8px;margin-top:14px}
.chk input{width:auto}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:820px){.grid2{grid-template-columns:1fr}}
.hide{display:none}
.muted{color:var(--muted);font-size:12px}

/* ============================================================
   SIGN-IN SCENE
   A warm, softly-lit welcome scene: the background video is
   sepia-warmed and veiled in cream so it matches the paper brand,
   with a frosted cream sign-in card floating over it.
   ============================================================ */
.dc-scene{position:fixed;inset:0;overflow:hidden;display:grid;place-items:center;background:#E4D9BF}
.dc-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  filter:sepia(.5) saturate(1.25) hue-rotate(-18deg) brightness(1.02) contrast(.98)}
.dc-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(1100px 760px at 50% 46%,rgba(236,227,206,.28),rgba(228,217,191,.72) 82%),
    linear-gradient(180deg,rgba(236,227,206,.42),rgba(222,210,180,.66));
  box-shadow:inset 0 0 240px 80px rgba(150,120,80,.28)}

/* vanishing-point glow deep down the hall */
.dc-glow{position:absolute;top:34%;left:50%;width:340px;height:340px;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(196,86,47,.42),rgba(176,141,87,.16) 45%,transparent 70%);
  filter:blur(20px);border-radius:50%;animation:pulseGlow 5s ease-in-out infinite}
@keyframes pulseGlow{0%,100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.9;transform:translate(-50%,-50%) scale(1.12)}}

/* corridor walls = server racks, angled into the distance */
.dc-wall{position:absolute;top:-30%;height:160%;width:52%;transform-style:preserve-3d}
.dc-wall .rack{position:absolute;inset:0;
  background:
    /* unit slats */ repeating-linear-gradient(0deg,rgba(90,70,40,.06) 0 2px,transparent 2px 26px),
    /* rack columns */ repeating-linear-gradient(90deg,#E7DCC1 0 78px,#DCCFB0 78px 84px),
    linear-gradient(90deg,#E7DCC1,#D8CBAC);
  background-size:100% 130px,100% 100%,100% 100%;
  animation:rackrun 7s linear infinite}
/* blinking status LEDs layered over the racks */
.dc-wall .leds{position:absolute;inset:0;
  background-image:
    radial-gradient(circle,#C4562F 40%,transparent 45%),
    radial-gradient(circle,#5F7548 40%,transparent 45%),
    radial-gradient(circle,#B08D57 40%,transparent 45%);
  background-size:84px 26px,84px 26px,84px 26px;
  background-position:14px 8px,50px 18px,30px 40px;
  opacity:.75;mix-blend-mode:multiply;animation:blink 1.6s steps(1) infinite}
.dc-wall.left{left:0;transform-origin:left center;transform:rotateY(42deg)}
.dc-wall.right{right:0;transform-origin:right center;transform:rotateY(-42deg)}
.dc-wall.right .leds{animation-delay:.8s}
.dc-wall.right .rack{animation-delay:.3s}
.dc-wall::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(228,217,191,.92));}
.dc-wall.right::after{background:linear-gradient(270deg,transparent,rgba(228,217,191,.92))}
@keyframes rackrun{from{background-position-y:0,0,0}to{background-position-y:130px,0,0}}
@keyframes blink{0%{opacity:.2}20%{opacity:.8}40%{opacity:.3}60%{opacity:.7}80%{opacity:.25}100%{opacity:.55}}

/* glossy warm floor with receding grid */
.dc-floor{position:absolute;left:-25%;right:-25%;bottom:-6%;height:62%;transform-origin:bottom center;
  transform:rotateX(74deg);
  background:
    repeating-linear-gradient(90deg,rgba(176,141,87,.20) 0 1px,transparent 1px 70px),
    repeating-linear-gradient(0deg,rgba(176,141,87,.20) 0 1px,transparent 1px 70px),
    linear-gradient(0deg,#E7DCC1 0,#DCCFB0 100%);
  background-color:#E4D9BF;
  animation:floorrun 7s linear infinite;
  box-shadow:0 0 120px 30px rgba(150,120,80,.20) inset}
@keyframes floorrun{from{background-position:0 0,0 0,0 0}to{background-position:0 70px,0 70px,0 0}}
.dc-ceiling{position:absolute;left:-25%;right:-25%;top:-6%;height:40%;transform-origin:top center;
  transform:rotateX(-74deg);
  background:repeating-linear-gradient(90deg,rgba(176,141,87,.10) 0 1px,transparent 1px 90px);
  background-color:#ECE3CE}

/* floating warm email icons */
.holo{position:absolute;color:#C4562F;filter:drop-shadow(0 0 8px rgba(196,86,47,.5));
  opacity:.0;animation:floatUp 9s ease-in-out infinite}
.holo svg{display:block}
.holo::after{content:"";position:absolute;inset:0;
  background:repeating-linear-gradient(0deg,rgba(196,86,47,.16) 0 1px,transparent 1px 3px);
  mix-blend-mode:multiply;opacity:.4}
@keyframes floatUp{
  0%{opacity:0;transform:translateY(40px) scale(.9) rotate(-4deg)}
  15%{opacity:.8}
  50%{transform:translateY(-30px) scale(1.05) rotate(3deg)}
  85%{opacity:.65}
  100%{opacity:0;transform:translateY(-90px) scale(1.1) rotate(-2deg)}}
.holo.h1{left:16%;top:52%;animation-duration:8s}
.holo.h2{left:74%;top:46%;animation-duration:10s;animation-delay:1.6s;color:#5F7548}
.holo.h3{left:30%;top:62%;animation-duration:11s;animation-delay:3.2s;transform:scale(.7)}
.holo.h4{left:62%;top:64%;animation-duration:9.5s;animation-delay:2.4s;color:#B08D57;transform:scale(.8)}

/* drifting light particles */
.dc-particles{position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(1.5px 1.5px at 20% 30%,rgba(150,120,80,.7),transparent),
    radial-gradient(1.5px 1.5px at 80% 20%,rgba(150,120,80,.55),transparent),
    radial-gradient(1px 1px at 60% 70%,rgba(176,141,87,.6),transparent),
    radial-gradient(1.5px 1.5px at 40% 80%,rgba(150,120,80,.5),transparent),
    radial-gradient(1px 1px at 90% 60%,rgba(176,141,87,.55),transparent);
  animation:drift 12s linear infinite;opacity:.6}
@keyframes drift{from{transform:translateY(0)}to{transform:translateY(-40px)}}

/* frosted cream sign-in card */
.dc-card{position:relative;z-index:5;width:400px;max-width:90vw;
  background:linear-gradient(180deg,rgba(246,239,221,.82),rgba(236,227,206,.82));
  border:1px solid rgba(176,141,87,.42);border-radius:20px;padding:30px 30px 26px;
  backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
  box-shadow:0 30px 80px rgba(90,70,40,.35),0 0 0 1px rgba(176,141,87,.10),
    inset 0 1px 0 rgba(255,255,255,.5);
  animation:cardIn .7s cubic-bezier(.2,.9,.3,1)}
@keyframes cardIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.dc-card::before{content:"";position:absolute;top:0;left:0;right:0;height:50%;border-radius:20px 20px 40% 40%;
  background:linear-gradient(180deg,rgba(255,255,255,.35),transparent);pointer-events:none}
.dc-card .logo-wrap{display:flex;justify-content:center;margin-bottom:4px}
.dc-card .logo-wrap img{width:210px;max-width:70%;filter:drop-shadow(0 6px 16px rgba(90,70,40,.28))}
.dc-card h2{text-align:center;margin:6px 0 4px;font-size:19px;text-transform:none;letter-spacing:0;color:#2E2A22}
.dc-card p{text-align:center;color:#857C6A;font-size:12.5px;margin:0 0 20px;line-height:1.5}
.dc-card label{color:#5C564A}
.dc-card input{background:rgba(255,255,255,.7);border:1px solid rgba(176,141,87,.35)}
.dc-card input:focus{border-color:#C4562F;box-shadow:0 0 0 3px rgba(196,86,47,.15)}
.dc-card .btn.primary{width:100%;margin-top:16px;
  background:linear-gradient(135deg,#C4562F,#A8471F);box-shadow:0 8px 24px rgba(196,86,47,.35)}
.dc-card .err{color:#B23A2E;font-size:13px;margin-top:10px;min-height:18px;text-align:center}
.dc-badge{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:5;
  color:#6E6552;font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  display:flex;gap:10px;align-items:center;opacity:.85}
.dc-badge .lk{width:5px;height:5px;border-radius:50%;background:#5F7548;box-shadow:0 0 8px #5F7548}
@media(prefers-reduced-motion:reduce){.dc-scene *{animation:none!important}}

/* ===== platform picker tiles ===== */
.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:6px}
@media(max-width:720px){.platform-grid{grid-template-columns:repeat(2,1fr)}}
.ptile{position:relative;border:1px solid var(--line);border-radius:14px;overflow:hidden;
  cursor:pointer;background:#F1E8D2;transition:.15s}
.ptile img{width:100%;display:block;aspect-ratio:1/1.05;object-fit:cover;opacity:.98}
.ptile:hover{border-color:var(--accent);transform:translateY(-2px)}
.ptile.sel{border-color:var(--accent2);
  box-shadow:0 0 0 2px rgba(95,117,72,.5),0 12px 30px rgba(90,70,40,.28)}
.ptile.sel::before{content:"✓";position:absolute;top:8px;right:8px;width:22px;height:22px;
  border-radius:50%;background:var(--accent2);color:#F6EFDD;display:grid;place-items:center;
  font-weight:800;font-size:13px;z-index:2}
.ptile.disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}
.ptile .soon{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);font-size:10px;
  background:#E6DABF;color:var(--muted);padding:2px 8px;border-radius:6px}
.pick-hint{margin-top:14px;color:var(--muted);font-size:12px;display:flex;align-items:center;gap:7px}
.pick-hint .arrow{color:var(--accent2)}

/* selected-platform bar on the credentials sub-screen */
.plat-bar{display:flex;align-items:center;gap:12px;background:var(--panel2);border:1px solid var(--line);
  border-radius:12px;padding:10px 12px;margin-bottom:6px}
.plat-bar img{width:44px;height:44px;object-fit:cover;border-radius:9px;border:1px solid var(--line)}
.plat-bar .pl-name{font-weight:700;font-size:14px}
.plat-bar .pl-sub{color:var(--muted);font-size:12px}
.plat-bar .change{margin-left:auto}

/* post-login hero banner (image-styled) */
.hero{position:relative;border-radius:18px;overflow:hidden;margin-bottom:22px;
  border:1px solid #6E5A3E;min-height:158px;display:flex;align-items:center;
  background:linear-gradient(120deg,#3A2E20,#2E2A22 55%,#241F18)}
/* the old blue data-center photos are dropped for a warm branded panel */
.hero>img{display:none}
.hero::before{content:"";position:absolute;inset:0;
  background:radial-gradient(680px 300px at 82% 120%,rgba(196,86,47,.5),transparent 60%),
    radial-gradient(520px 260px at 8% -20%,rgba(95,117,72,.35),transparent 60%)}
.hero .veil{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(46,42,34,.86),rgba(46,42,34,.42) 55%,rgba(46,42,34,.12))}
.hero .content{position:relative;padding:22px 26px;width:100%;display:flex;align-items:center;gap:20px}
.hero .content .hlogo{height:44px;filter:drop-shadow(0 4px 12px rgba(0,0,0,.35))}
.hero .content h2{margin:0;font-size:21px;text-transform:none;letter-spacing:0;color:#FBF6E9}
.hero .content p{margin:4px 0 0;color:#E7DCC1;font-size:13px}
.hero .content .spacer{flex:1}
/* slim banner strip behind the dashboard title */
.dash-banner{position:relative;border-radius:14px;overflow:hidden;border:1px solid #6E5A3E;
  margin-bottom:18px;min-height:96px;display:flex;align-items:center;
  background:linear-gradient(120deg,#3A2E20,#2E2A22 55%,#241F18)}
.dash-banner>img{display:none}
.dash-banner .veil{position:absolute;inset:0;
  background:radial-gradient(560px 240px at 88% 130%,rgba(196,86,47,.42),transparent 60%),
    radial-gradient(420px 220px at 6% -30%,rgba(95,117,72,.3),transparent 60%)}
.dash-banner .content{position:relative;padding:14px 20px;display:flex;align-items:center;width:100%;gap:14px}
.dash-banner .content h2{color:#FBF6E9}
.dash-banner .content .muted{color:#E7DCC1}
.dash-banner .content .btn.ghost{background:rgba(246,239,221,.14);border-color:rgba(246,239,221,.4);color:#FBF6E9}

/* projects home */
.proj-head{display:flex;align-items:center;margin-bottom:18px}
.proj-head h2{font-size:16px;margin:0;color:var(--text);text-transform:none;letter-spacing:0}
.proj-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:820px){.proj-grid{grid-template-columns:1fr}}
.pcard{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px;
  cursor:pointer;transition:.15s;position:relative}
.pcard:hover{border-color:var(--accent);transform:translateY(-1px)}
.pcard .name{font-size:16px;font-weight:700;margin-bottom:8px}
.pcard .flow{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-bottom:12px}
.provtag{background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:3px 8px;
  font-size:11px;font-weight:600;color:var(--text)}
.pcard .meta{display:flex;gap:14px;font-size:12px;color:var(--muted)}
.pcard .del{position:absolute;top:12px;right:12px}
.empty{text-align:center;color:var(--muted);padding:60px 20px}

/* stepper */
.stepper{display:flex;gap:8px;margin-bottom:22px}
.step{flex:1;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line);
  border-radius:12px;padding:11px 14px;font-size:13px;color:var(--muted)}
.step .n{width:24px;height:24px;border-radius:50%;background:var(--panel2);display:grid;place-items:center;
  font-size:12px;font-weight:700;border:1px solid var(--line)}
.step.active{border-color:var(--accent);color:var(--text)}
.step.active .n{background:var(--accent);color:#fff;border-color:var(--accent)}
.step.done .n{background:var(--accent2);color:#F6EFDD;border-color:var(--accent2)}
.wizard-nav{display:flex;gap:10px;margin-top:22px}
.wizard-nav .spacer{flex:1}

/* mailbox table */
table{width:100%;border-collapse:collapse}
th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);text-align:left;
  padding:6px 8px;font-weight:600}
td{padding:4px 6px} td input{padding:7px 9px;font-size:13px}
.mb-tools{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;align-items:center}

/* verify list */
.verify-list{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.vitem{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);
  border-radius:10px;padding:10px 12px;font-size:13px}
.pill{font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px}
.pill.ok{background:rgba(95,117,72,.16);color:var(--ok)}
.pill.bad{background:rgba(178,58,46,.15);color:var(--danger)}
.pill.run{background:rgba(196,86,47,.16);color:var(--accent)}
.pill.pending{background:#E6DABF;color:var(--muted)}
.pill.partial{background:rgba(176,141,87,.18);color:var(--warn)}

/* dashboard */
.mono{font-variant-numeric:tabular-nums}
.actionbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:20px}
.totals{display:flex;gap:24px;margin:6px 0 18px}
.totals .t{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em}
.totals .t b{font-size:24px;display:block;color:var(--text)}
.mb-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:820px){.mb-cards{grid-template-columns:1fr}}
.mbc{background:var(--panel2);border:1px solid var(--line);border-radius:12px;padding:13px 15px}
.mbc .top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.mbc .addr{font-size:13px;font-weight:600}
.mbc .sub{font-size:11px;color:var(--muted);margin-top:2px}
.mbc .nums{display:flex;gap:16px;margin-top:11px;font-size:12px;color:var(--muted)}
.mbc .nums b{display:block;font-size:17px;color:var(--text)}
.bar{height:5px;background:#DCCFB0;border-radius:999px;margin-top:11px;overflow:hidden}
.bar>span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .4s}
.log{background:#F1E8D2;border:1px solid var(--line);border-radius:10px;padding:12px 14px;
  font-family:ui-monospace,Consolas,monospace;font-size:12px;color:#5C564A;height:170px;overflow:auto;
  white-space:pre-wrap;line-height:1.55}
.banner{border-radius:10px;padding:11px 14px;font-size:13px;margin-top:14px}
.banner.done{background:rgba(95,117,72,.14);border:1px solid rgba(95,117,72,.32);color:var(--ok)}
.banner.err{background:rgba(178,58,46,.12);border:1px solid rgba(178,58,46,.3);color:var(--danger)}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--panel);
  border:1px solid var(--line);border-radius:10px;padding:11px 18px;font-size:13px;
  box-shadow:0 10px 30px rgba(90,70,40,.3);opacity:0;transition:.25s;z-index:50}
.toast.show{opacity:1}

/* ===== sign-in card polish (overrides earlier card rules) ===== */
.dc-card{
  background:linear-gradient(180deg,rgba(246,239,221,.86),rgba(235,225,202,.82));
  border:1px solid rgba(176,141,87,.38);
  backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);
  box-shadow:0 34px 90px rgba(90,70,40,.4),inset 0 1px 0 rgba(255,255,255,.55),
    0 0 80px rgba(196,86,47,.14);
  animation:cardIn .7s cubic-bezier(.2,.9,.3,1),glowPulse 5s ease-in-out infinite}
@keyframes glowPulse{0%,100%{box-shadow:0 34px 90px rgba(90,70,40,.4),
    inset 0 1px 0 rgba(255,255,255,.55),0 0 70px rgba(196,86,47,.12)}
  50%{box-shadow:0 34px 90px rgba(90,70,40,.4),
    inset 0 1px 0 rgba(255,255,255,.55),0 0 110px rgba(196,86,47,.22)}}
/* warm gradient border ring */
.dc-card::after{content:"";position:absolute;inset:0;border-radius:20px;padding:1px;
  background:linear-gradient(135deg,rgba(196,86,47,.6),rgba(95,117,72,.35) 40%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
/* soft halo behind the logo */
.dc-card .logo-wrap{position:relative;margin-bottom:2px}
.dc-card .logo-wrap::before{content:"";position:absolute;width:250px;height:130px;left:50%;top:46%;
  transform:translate(-50%,-50%);z-index:-1;filter:blur(14px);
  background:radial-gradient(ellipse,rgba(196,86,47,.30),rgba(176,141,87,.12) 55%,transparent 72%)}
.dc-card .logo-wrap img{width:230px;max-width:74%}
/* feature pills */
.dc-feats{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:2px 0 20px}
.dc-feat{font-size:11px;color:#7A5230;background:rgba(196,86,47,.10);
  border:1px solid rgba(176,141,87,.34);padding:4px 11px;border-radius:999px;white-space:nowrap}
.dc-card .btn.primary{letter-spacing:.02em;font-size:15px;padding:12px}
