/* Grikera — hoja de estilo común */

:root{
  --paper:#f7f3ea;
  --paper-alt:#eae4d8;
  --dark:#43221f;
  --ink:#241b16;
  --ink-soft:#786b5d;
  --accent:#8a2c25;
  --gold:#8a6a24;
  --rule:#cfc4b1;
  --serif:Georgia,'Times New Roman',serif;
  --sans:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --step:80px;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.72;
  overflow-x:hidden;
}

img{max-width:100%;height:auto;display:block;}

a{color:var(--accent);text-decoration:underline;text-decoration-style:dashed;text-underline-offset:3px;text-decoration-thickness:1px;}
a:hover{text-decoration-style:solid;}
a:focus-visible,:focus-visible{outline:2px solid var(--accent);outline-offset:3px;}

h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:.005em;text-transform:none;}
h3{font-family:var(--serif);font-weight:400;font-style:italic;}

h1{font-size:clamp(2.05rem,4.6vw,3.3rem);line-height:1.14;margin:0;}
h2{font-size:clamp(1.45rem,2.6vw,2.05rem);line-height:1.24;margin:0 0 18px;}
h3{font-size:1.2rem;line-height:1.4;margin:34px 0 10px;}
p{margin:0 0 18px;max-width:74ch;}
p:last-child{margin-bottom:0;}

.meta{
  font-family:var(--sans);
  font-size:12px;
  line-height:1.5;
  letter-spacing:.16em;
  color:var(--gold);
  margin:0 0 14px;
}

/* ---------- rejilla ---------- */
.wrap{width:100%;max-width:1180px;margin:0 auto;padding:0 24px;}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:26px;}

/* ---------- costura ---------- */
.stitch{position:relative;}
.stitch::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    repeating-linear-gradient(90deg,var(--accent) 0 14px,transparent 14px 26px),
    repeating-linear-gradient(90deg,var(--accent) 0 14px,transparent 14px 26px),
    repeating-linear-gradient(0deg,var(--accent) 0 14px,transparent 14px 26px),
    repeating-linear-gradient(0deg,var(--accent) 0 14px,transparent 14px 26px);
  background-size:100% 2px,100% 2px,2px 100%,2px 100%;
  background-position:0 0,0 100%,0 0,100% 0;
  background-repeat:no-repeat;
}
.stitch--inset::before{inset:-24px;}
.stitch--inset16::before{inset:-16px;}
.stitch--inset12::before{inset:-12px;}

.edge-right{
  background-image:repeating-linear-gradient(0deg,var(--accent) 0 12px,transparent 12px 24px);
  background-size:2px 100%;
  background-position:100% 0;
  background-repeat:no-repeat;
  padding-right:28px;
}
.edge-left{
  background-image:repeating-linear-gradient(0deg,var(--accent) 0 12px,transparent 12px 24px);
  background-size:2px 100%;
  background-position:0 0;
  background-repeat:no-repeat;
  padding-left:28px;
}
.edge-both{
  background-image:
    repeating-linear-gradient(0deg,var(--gold) 0 12px,transparent 12px 24px),
    repeating-linear-gradient(0deg,var(--gold) 0 12px,transparent 12px 24px);
  background-size:2px 100%,2px 100%;
  background-position:0 0,100% 0;
  background-repeat:no-repeat;
  padding:0 28px;
}
.edge-top{
  background-image:repeating-linear-gradient(90deg,var(--gold) 0 12px,transparent 12px 24px);
  background-size:100% 2px;
  background-position:0 0;
  background-repeat:no-repeat;
  padding-top:26px;
}

hr.seam{
  border:0;
  height:6px;
  margin:0;
  background-image:
    linear-gradient(var(--rule),var(--rule)),
    repeating-linear-gradient(90deg,var(--accent) 0 12px,transparent 12px 26px);
  background-size:100% 1px,100% 2px;
  background-position:0 0,0 6px;
  background-repeat:no-repeat;
}

/* ---------- cabecera ---------- */
.site-head{padding:26px 0 22px;}
.site-head .grid{align-items:baseline;}
.brand{
  grid-column:1/5;
  font-family:var(--serif);
  font-size:1.35rem;
  letter-spacing:.04em;
  color:var(--ink);
  text-decoration:none;
}
.brand span{display:block;font-family:var(--sans);font-size:12px;letter-spacing:.16em;color:var(--gold);}
.site-nav{grid-column:5/13;}
.site-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 26px;margin:0;padding:0;justify-content:flex-end;}
.site-nav a{font-size:15px;color:var(--ink);text-decoration:none;padding-bottom:2px;}
.site-nav a:hover{color:var(--accent);}
.site-nav a[aria-current="page"]{
  color:var(--accent);
  background-image:repeating-linear-gradient(90deg,var(--accent) 0 6px,transparent 6px 12px);
  background-size:100% 2px;
  background-position:0 100%;
  background-repeat:no-repeat;
}

/* ---------- hero ---------- */
.hero{padding:34px 0 var(--step);}
.hero-frame{padding:46px 40px 44px;}
.hero h1{grid-column:1/9;}
.hero .lede{grid-column:9/13;align-self:end;}
.hero .lede p{font-size:16px;color:var(--ink-soft);}
.hero-figure{grid-column:7/13;margin:52px 0 0;justify-self:end;width:100%;}
.hero-figure img{width:100%;aspect-ratio:4/3;object-fit:cover;}
figcaption{
  font-size:12.5px;
  letter-spacing:.05em;
  line-height:1.55;
  color:var(--ink-soft);
  margin-top:16px;
  max-width:44ch;
}
.hero-side{grid-column:1/7;align-self:end;margin-top:52px;}
.hero-side p{font-size:16px;}

/* ---------- secciones ---------- */
.band{padding:var(--step) 0;}
.band--alt{background:var(--paper-alt);}
.band--dark{background:var(--dark);color:var(--paper);}
.band--dark h2,.band--dark h3{color:var(--paper);}
.band--dark .meta{color:#d8b46a;}
.band--dark figcaption{color:#c8b6a8;}
.band--dark a{color:#e9c98a;}

.block{max-width:100%;}
.block--l{grid-column:1/8;}
.block--r{grid-column:6/13;}
.block--nr{grid-column:8/13;}
.block--nl{grid-column:1/6;}
.block--w{grid-column:1/10;}

.stack > * + *{margin-top:var(--step);}

ul.check,ol.steps{margin:20px 0 0;padding:0 0 0 26px;max-width:70ch;}
ul.check{list-style:none;padding-left:0;}
ul.check li{position:relative;padding-left:26px;margin-bottom:11px;}
ul.check li::before{
  content:"";
  position:absolute;
  left:0;top:.72em;
  width:11px;height:2px;
  background:var(--accent);
}
ol.steps li{margin-bottom:11px;padding-left:6px;}
ol.steps li::marker{color:var(--gold);font-family:var(--serif);}
.band--dark ul.check li::before{background:#d8b46a;}

dl.terms{margin:22px 0 0;max-width:70ch;}
dl.terms dt{font-family:var(--serif);font-style:italic;font-size:1.08rem;margin-top:18px;}
dl.terms dd{margin:4px 0 0;}

.note{
  font-size:15.5px;
  color:var(--ink-soft);
  margin-top:26px;
}

/* ---------- sección oscura con imagen ---------- */
.detail-figure{grid-column:2/6;margin:0;}
.detail-figure img{width:100%;aspect-ratio:4/5;object-fit:cover;}
.detail-text{grid-column:7/13;align-self:center;}

/* ---------- about ---------- */
.about-block + .about-block{margin-top:64px;}
.about-b1{grid-column:1/9;}
.about-b2{grid-column:7/13;}
.about-b3{grid-column:2/9;}

/* ---------- legal ---------- */
.legal{grid-column:1/9;}
.legal-aside{grid-column:9/13;}
.legal-aside p{font-size:15px;color:var(--ink-soft);}
.legal h2{margin-top:44px;}
.legal h2:first-of-type{margin-top:0;}

/* ---------- pie ---------- */
.site-foot{background:var(--paper-alt);margin-top:0;}
.site-foot .inner{padding:56px 0 62px;}
.foot-grid{align-items:start;}
.foot-a{grid-column:1/7;}
.foot-b{grid-column:8/13;}
.foot-a .name{font-family:var(--serif);font-size:1.3rem;margin:0 0 10px;}
.foot-a p{font-size:15px;color:var(--ink-soft);max-width:42ch;}
.foot-b ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:7px;}
.foot-b a{color:var(--ink);text-decoration:none;font-size:15px;}
.foot-b a:hover{color:var(--accent);}
.foot-mail{font-size:15px;}
.foot-mail a{color:var(--accent);}
.foot-legal{font-size:13px;color:var(--ink-soft);margin-top:26px;}

/* ---------- responsive ---------- */
@media (max-width:900px){
  :root{--step:56px;}
  .hero-frame{padding:34px 26px 32px;}
  .hero h1{grid-column:1/13;}
  .hero .lede{grid-column:1/13;}
  .hero .lede.edge-left{padding-left:0;padding-top:22px;background-image:repeating-linear-gradient(90deg,var(--accent) 0 12px,transparent 12px 24px);background-size:100% 2px;background-position:0 0;}
  .hero-figure,.hero-side{grid-column:1/13;justify-self:stretch;margin-top:30px;}
  .block--l,.block--r,.block--nr,.block--nl,.block--w,
  .detail-figure,.detail-text,
  .about-b1,.about-b2,.about-b3,
  .legal,.legal-aside,
  .foot-a,.foot-b{grid-column:1/13;}
  .detail-text{margin-top:32px;}
  .legal-aside{margin-top:34px;}
  .foot-b{margin-top:34px;}
  .about-block + .about-block{margin-top:44px;}
  .stack > * + *{margin-top:48px;}
}

@media (max-width:640px){
  :root{--step:48px;}
  body{font-size:16.5px;}
  .wrap{padding:0 18px;}
  .grid{gap:18px;}
  .site-head{padding:20px 0 16px;}
  .brand{grid-column:1/13;}
  .site-nav{grid-column:1/13;margin-top:12px;}
  .site-nav ul{justify-content:flex-start;gap:6px 18px;}
  .edge-right,.edge-left,.edge-both{padding-left:0;padding-right:0;background-image:none;}
  .edge-both{padding:0;}
  .stitch--inset::before{inset:-14px;}
  .hero{padding-top:22px;}
  .hero-frame{padding:26px 18px 28px;}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;}
}