:root{
  --maroon:#6B0F2B;
  --maroon-dark:#4A0A1E;
  --paper:#F7EBD6;
  --paper-deep:#EFE0C4;
  --ink:#2B1614;
  --desk:#161311;
  --desk-2:#1e1a17;
  --wa:#25D366;
  --tg:#2AABEE;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;color:var(--ink)}
html,body{
  font-family:"Noto Sans","Noto Sans Telugu","Noto Sans Devanagari",sans-serif;
  background-color:var(--desk);
  background-image:
    radial-gradient(ellipse at 20% 10%, rgba(80,60,40,.18), transparent 42%),
    radial-gradient(ellipse at 80% 80%, rgba(40,30,20,.25), transparent 50%),
    repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(255,255,255,.012) 2px, rgba(255,255,255,.012) 3px),
    repeating-linear-gradient(90deg, transparent, transparent 3px, rgba(0,0,0,.08) 3px, rgba(0,0,0,.08) 4px);
  background-attachment:fixed;
}
a,button{font:inherit;color:inherit}
button{cursor:pointer}
.app{min-height:100vh;display:flex;flex-direction:column}

/* maroon masthead */
.masthead{
  background:var(--maroon);
  color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:10px 22px;flex-wrap:wrap;
  border-bottom:1px solid #3d0818;
}
.brand{display:flex;align-items:center;gap:12px;min-width:220px}
.brand img,.seal{
  width:56px;height:56px;border-radius:50%;object-fit:cover;
  border:2px solid #fff;background:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.15);
}
.brand h1{
  margin:0;font-family:"Noto Serif","Noto Serif Telugu",Georgia,serif;
  font-size:22px;letter-spacing:.06em;color:#fff;font-weight:700;
}
.tagline{
  margin:2px 0 0;font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  opacity:.88;font-family:"Noto Serif",Georgia,serif;
}
.mast-menu{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-family:"Noto Serif",Georgia,serif;font-size:13px;letter-spacing:.12em;
}
.mast-menu a{color:#fff;text-decoration:none;opacity:.92}
.mast-menu a:hover,.mast-menu a.on{opacity:1;text-decoration:underline;text-underline-offset:4px}
.mast-menu .dot{opacity:.55}
.mast-right{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.langs{display:flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.1em}
.langs a,.langs button{
  background:transparent;border:0;color:#fff;padding:0;text-decoration:none;opacity:.75;
}
.langs a.on,.langs button.on{opacity:1;font-weight:700}
.langs .sep{opacity:.4}
.doors{display:flex;gap:8px}
.doors a{
  display:block;border:1px solid rgba(255,255,255,.55);padding:6px 10px;text-decoration:none;
  min-width:88px;text-align:center;font-size:11px;letter-spacing:.08em;color:#fff;
}
.doors a small{display:block;opacity:.7;font-size:9px;letter-spacing:.04em}

/* cream paper strip */
.paper-strip{
  background:linear-gradient(#F6EBDA,#EFE0C4);
  color:var(--ink);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 22px;flex-wrap:wrap;
  box-shadow:0 2px 0 rgba(0,0,0,.15);
  border-bottom:1px dashed #c9b48a;
}
.yp-stamp{
  background:var(--paper);border:1px solid var(--maroon);color:var(--maroon);
  padding:6px 12px;letter-spacing:.1em;font-size:11px;font-weight:700;
  clip-path:polygon(3% 0,97% 2%,100% 18%,98% 82%,100% 100%,2% 98%,0 80%,2% 20%);
  box-shadow:1px 2px 0 rgba(107,15,43,.15);
}
.slug-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.perf{
  background:#fff8ee;border:1px solid #8a6a4a;padding:5px 11px;font-size:11px;letter-spacing:.08em;
  border-style:dashed solid;position:relative;
}
.chev{opacity:.55;font-size:12px}
.beats{display:flex;flex-wrap:wrap;gap:6px}
.beats a,.beats button{
  border:1px solid #2B1614;background:transparent;padding:4px 9px;
  font-size:11px;letter-spacing:.06em;text-decoration:none;border-radius:0;
}
.beats a.on,.beats button.on{border-color:var(--maroon);color:var(--maroon);font-weight:700}

.stage{flex:1;padding:22px 18px 48px}

/* magazine layout */
.magazine{max-width:1180px;margin:0 auto}
.mag{
  display:grid;grid-template-columns:1.55fr .9fr;gap:18px;align-items:stretch;
}
.sides{display:flex;flex-direction:column;gap:14px}
.more{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:22px;
}
@media(max-width:900px){
  .mag{grid-template-columns:1fr}
  .more{grid-template-columns:1fr 1fr}
  .doors{width:100%}
}
@media(max-width:620px){
  .more{grid-template-columns:1fr}
  .masthead{padding:10px 12px}
  .paper-strip{padding:10px 12px}
}

/* torn paper cuttings */
.cutting{
  --torn: polygon(
    0.8% 1.4%, 4% 0.2%, 9% 1.8%, 14% 0.3%, 20% 1.6%, 27% 0.2%, 34% 1.5%, 42% 0.1%, 50% 1.7%, 58% 0.3%, 66% 1.4%, 74% 0.2%, 82% 1.6%, 90% 0.4%, 96% 1.5%, 99.4% 5%,
    98.1% 13%, 99.6% 22%, 98% 32%, 99.5% 43%, 98.2% 54%, 99.6% 65%, 98.1% 76%, 99.4% 86%, 98.2% 94%,
    94% 99.3%, 86% 98%, 77% 99.5%, 68% 98.1%, 59% 99.4%, 50% 98%, 41% 99.5%, 32% 98.2%, 23% 99.4%, 14% 98%, 6% 99.2%, 1% 95%,
    1.8% 86%, 0.3% 76%, 1.7% 65%, 0.4% 54%, 1.6% 43%, 0.3% 32%, 1.7% 22%, 0.5% 12%
  );
  background:
    linear-gradient(180deg, rgba(255,255,255,.18), transparent 28%),
    repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(90,60,30,.03) 3px, rgba(90,60,30,.03) 4px),
    var(--paper);
  color:var(--ink);
  padding:18px 18px 16px;
  position:relative;
  clip-path:var(--torn);
  filter:drop-shadow(4px 7px 10px rgba(0,0,0,.42));
  min-height:160px;
}
.cutting.t2{
  --torn: polygon(
    0.4% 2%, 6% 0.4%, 13% 1.6%, 21% 0.1%, 29% 1.8%, 38% 0.3%, 47% 1.4%, 56% 0.2%, 65% 1.7%, 74% 0.1%, 83% 1.5%, 92% 0.4%, 99.2% 3.5%,
    98.4% 14%, 99.7% 26%, 98% 38%, 99.5% 50%, 98.2% 62%, 99.6% 74%, 98% 86%, 99.3% 96%,
    92% 99%, 83% 98.2%, 73% 99.5%, 63% 98%, 53% 99.4%, 43% 98.1%, 33% 99.5%, 23% 98%, 13% 99.3%, 4% 97.8%, 0.5% 93%,
    1.6% 82%, 0.2% 70%, 1.8% 58%, 0.4% 46%, 1.5% 34%, 0.3% 22%, 1.6% 10%
  );
}
.cutting.t3{
  --torn: polygon(
    1% 0.8%, 8% 1.7%, 16% 0.2%, 25% 1.5%, 33% 0.4%, 42% 1.8%, 51% 0.1%, 60% 1.4%, 69% 0.3%, 78% 1.6%, 87% 0.2%, 95% 1.7%, 99.5% 6%,
    98% 16%, 99.6% 28%, 98.2% 40%, 99.4% 53%, 98% 66%, 99.5% 78%, 98.1% 89%, 99% 97%,
    91% 98.4%, 81% 99.5%, 71% 98%, 61% 99.3%, 51% 98.1%, 40% 99.5%, 30% 98%, 20% 99.4%, 10% 98.2%, 2% 96%,
    0.4% 86%, 1.7% 74%, 0.2% 62%, 1.6% 50%, 0.3% 38%, 1.8% 26%, 0.5% 14%
  );
}
.cutting.hero{min-height:420px;padding:22px 22px 18px}
.cutting.hero .hook{font-size:28px;line-height:1.2}
.cutting.hero .rewrite{font-size:15px}
.cutting.hero .cutimg{height:240px}
.stamp{
  display:inline-block;background:var(--maroon);color:#fff;
  font-size:10px;padding:3px 8px;letter-spacing:.1em;font-weight:700;
}
.cutimg{
  width:100%;height:120px;object-fit:cover;display:block;margin:10px 0 8px;
  filter:grayscale(.25) sepia(.18) contrast(1.05);
  border:0;
}
.hook{
  margin:8px 0 6px;font-family:"Noto Serif","Noto Serif Telugu","Noto Serif Devanagari",Georgia,serif;
  font-size:18px;color:#4A0A1E;line-height:1.25;font-weight:700;
}
.hook a{color:inherit;text-decoration:none}
.hook a:hover{color:var(--maroon)}
.rewrite{margin:0 0 8px;font-size:13px;line-height:1.5}
.meta{font-size:11px;letter-spacing:.03em;color:var(--maroon);margin-bottom:8px}

/* share */
.share{display:flex;gap:8px;margin-top:10px;align-items:center;flex-wrap:wrap}
.share a,.share button{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;padding:4px;border:0;background:transparent;
  text-decoration:none;border-radius:0;
}
.share svg{width:18px;height:18px;display:block}
.share .copy-link{border:1px solid #8a6a4a;background:#fff8ee}
.share .ok{outline:2px solid var(--maroon)}

.list{display:flex;flex-direction:column;gap:14px}
.form{display:flex;flex-direction:column;gap:10px;max-width:640px}
.form input,.form textarea,.form select{padding:8px;border:1px dashed var(--maroon);background:#fffaf2}
.form label{font-size:12px;letter-spacing:.06em}
.btn{background:var(--maroon);color:#fff;border:0;padding:12px 16px;letter-spacing:.08em}
.overlay{position:fixed;inset:0;background:rgba(20,16,12,.78);display:flex;align-items:center;justify-content:center;padding:16px;z-index:20}
.sheet{background:#F3E6D2;max-width:820px;width:100%;max-height:90vh;overflow:auto;padding:18px}
.cols{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
@media(max-width:700px){.cols{grid-template-columns:1fr}}
.muted{opacity:.7;font-size:13px}
.hidden{display:none}
.chip{background:#efe0c8;border:1px solid var(--maroon);padding:4px 10px;font-size:12px}

/* article / tool pages sit on desk, not a SaaS sheet */
.page-cut{max-width:760px;margin:0 auto}
.crumb{color:#c9b8a0;font-size:11px;letter-spacing:.12em;margin:0 0 12px}

.region-tag{position:absolute;top:12px;right:14px;background:#2B1614;color:#F3E6D2;font-size:10px;letter-spacing:.14em;padding:3px 7px}
.doors a.tiny{min-width:auto;padding:6px 8px;opacity:.88;border-style:dashed}
.empty{opacity:.45;text-align:center;padding:36px 10px;letter-spacing:.16em}

.tabs{display:none !important}
.stamp.region{background:transparent;color:var(--maroon);border:1px solid var(--maroon);margin-left:4px}
