/* PROYECTO DILO: edición independiente 2026-10-28. Inspirada en el código y contenidos de la versión Lovable. */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Display:wght@400;500;600&family=Noto+Sans:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--ink:#202020;--line:#dedede;--muted:#707070;--paper:#fff;--inverse:#f7f7f7;--font:"Noto Sans",Arial,Helvetica,sans-serif;--display:"Noto Sans Display","Noto Sans",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:#252525;font-family:var(--font);-webkit-font-smoothing:antialiased;line-height:1.52}a{color:inherit}button{font:inherit}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:var(--display);letter-spacing:-.02em}img{display:block;max-width:100%}:focus-visible{outline:3px solid currentColor;outline-offset:3px}blockquote{margin:0}
.container{width:100%;max-width:1408px;margin:auto;padding-inline:20px}.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}.site-header{background:#202020;color:var(--inverse)}.site-header .inner{display:flex;justify-content:space-between;align-items:center;min-height:88px;gap:18px}.brand{display:block;width:140px}.brand img{width:125px;height:auto;filter:invert(1);mix-blend-mode:screen}.header-links{display:flex;list-style:none;gap:40px;margin:0;padding:0;align-items:center}.header-links a{text-decoration:none;font-weight:500;font-size:18px;border-bottom:2px solid transparent;padding:10px 0;display:inline-flex;align-items:center;gap:10px}.header-links a:hover,.header-links a[aria-current=page]{border-bottom-color:currentColor}.header-links svg{width:22px;height:22px;fill:currentColor}.menu-toggle{display:none;border:1px solid #fff;color:#fff;background:none;padding:11px 16px;cursor:pointer}.skip{position:absolute;top:-80px;background:white;color:black;padding:10px;z-index:100}.skip:focus{top:4px;left:4px}
.hero{border-bottom:1px solid var(--line)}.hero .container{padding-block:100px 120px}.hero-logo{width:min(100%,900px);height:auto;margin:0 auto;mix-blend-mode:multiply}
.acrostico-section{border-bottom:1px solid var(--line);padding:82px 0 75px}.acrostico-wrapper{margin:0 auto;width:max-content;max-width:100%;display:grid;grid-template-columns:repeat(4,max-content);gap:clamp(18px,2.4vw,44px);justify-content:center}.acro-col{list-style:none;margin:0;padding:0 1.5em 0 0;min-width:0;font-size:clamp(22px,2.3vw,33px);line-height:1.25}.acro-col li{margin:0}.acro-item{position:relative;display:inline-block;background:transparent;border:none;padding:.05em 0;text-align:left;color:#222;cursor:pointer;transform-origin:left center;transition:color .22s,transform .22s;letter-spacing:.01em}.acro-item:hover,.acro-item:focus-visible,.acro-item[aria-pressed=true]{color:#888;transform:scale(1.15)}.acro-item:active{transform:scale(.96)}.acro-item:after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:#888;transition:width .22s}.acro-item[aria-pressed=true]:after{width:1.2em}.acro-selection{margin:40px auto 0;padding:16px 0;border-top:1px solid var(--line);min-height:48px;max-width:1050px;color:#707070;font-size:14px}
.statement{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding-block:64px 92px}.statement .label{grid-column:span 3}.statement blockquote{grid-column:5 / span 8;font-size:clamp(22px,2.2vw,30px);line-height:1.35}.statement h2{font-size:20px;font-weight:600;margin-bottom:0}.index-num{font-size:14px;color:#707070;margin-bottom:3px}.inverse{background:#202020;color:#f7f7f7}.inverse .index-num{color:#b5b5b5}.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:#707070;font-size:12px;font-weight:600}.page-head{padding-block:70px 90px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}.page-head .eyebrow{grid-column:span 3}.page-head .details{grid-column:span 9}.page-head h1{font-size:clamp(38px,5vw,72px);font-weight:500;line-height:1.05;letter-spacing:-.03em;max-width:950px;margin-bottom:0}.lede{font-size:clamp(18px,1.6vw,24px);max-width:790px;color:#707070;line-height:1.5;margin-top:30px}.row-section{border-bottom:1px solid var(--line);padding-block:60px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}.row-section .side{grid-column:span 3}.row-section .body{grid-column:5 / span 8;font-size:18px}.row-section h2{font-size:20px;font-weight:600;margin-bottom:0}.row-section blockquote{font-size:clamp(22px,2.4vw,30px);line-height:1.3}.row-section p{margin-bottom:15px}.row-section .large{font-size:22px;line-height:1.55}.muted{color:#707070}.thin-list{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}.thin-list li{padding:17px 0;border-bottom:1px solid var(--line)}.thin-list.cols{display:grid;grid-template-columns:repeat(2,1fr)}.cards{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#dedede}.card-detail{background:white;padding:28px}.card-detail h3{font-weight:500;font-size:20px;margin-bottom:12px}.two-column-detail{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}.two-column-detail li{border-bottom:1px solid var(--line);display:grid;grid-template-columns:14rem 1fr;gap:8px;padding:24px 0}.two-column-detail h3{font-size:20px;font-weight:500;margin:0}.outlined{border:1px solid #222;padding:32px}.waves-image{width:min(400px,40%);margin:80px 0 80px auto}.status-h2{font-size:24px;font-weight:500;margin-bottom:14px}.contact-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;padding-top:60px}.contact-card{border-top:2px solid #222;padding:32px 0 90px}.contact-card h2{font-size:30px;font-weight:500}.discord-page{min-height:40vh}.discord-icon{color:#222;width:68px;height:68px}
.site-footer{margin-top:128px;background:#202020;color:#f7f7f7;padding-block:64px 35px}.footer-logo{width:185px;filter:invert(1);mix-blend-mode:screen}.site-footer .intro{max-width:380px;font-size:14px;opacity:.8;margin-top:25px}.copyright{margin-top:48px;padding-top:24px;border-top:1px solid #555;font-size:12px;opacity:.7}
@media(max-width:960px){.acrostico-wrapper{grid-template-columns:repeat(2,max-content);gap:40px}.acro-col{font-size:26px}.page-head .details{grid-column:span 9}}
@media(max-width:700px){.container{padding-inline:20px}.grid{gap:18px}.site-header .inner{min-height:76px}.brand img{width:105px}.menu-toggle{display:block}.header-links{display:none;position:absolute;z-index:50;left:0;right:0;top:76px;padding:18px 20px 24px;background:#202020;flex-direction:column;align-items:flex-start;gap:8px}.header-links.open{display:flex}.hero .container{padding-block:65px 80px}.acrostico-section{padding-block:55px}.acrostico-wrapper{grid-template-columns:max-content;justify-content:start;width:max-content;margin-inline:auto;gap:28px}.acro-col{font-size:clamp(22px,5.5vw,28px)}.statement{grid-template-columns:1fr;gap:24px;padding-block:56px}.statement .label,.statement blockquote{grid-column:1}.page-head{grid-template-columns:1fr;gap:22px;padding-block:55px 65px}.page-head .eyebrow,.page-head .details{grid-column:1}.page-head h1{font-size:clamp(37px,8vw,55px)}.row-section{grid-template-columns:1fr;gap:22px;padding-block:48px}.row-section .side,.row-section .body{grid-column:1}.cards,.thin-list.cols,.contact-cards{grid-template-columns:1fr}.two-column-detail li{grid-template-columns:1fr;gap:12px}.site-footer{margin-top:70px}.waves-image{width:70%;margin:45px 0 45px auto}}
/* Ajustes de fidelidad y navegación de la edición para Cloudflare Pages. */
:root{--ink:oklch(.13 0 0);--muted:oklch(.44 0 0)}
body,.acro-item{color:oklch(.15 0 0)}
.site-header,.site-footer,.inverse{background:var(--ink)}
.hero h1{margin:0}
.acro-intro{text-align:center;margin-bottom:40px}
.acro-intro h2{font-size:20px;font-weight:600;margin-bottom:8px}
.acro-intro p{font-size:18px;color:var(--muted);margin-bottom:0}
.mobile-only{display:none}
.section-nav{margin-top:40px}
.section-nav ul{display:flex;flex-wrap:wrap;gap:12px 28px;list-style:none;margin:0;padding:0}
.section-nav a{display:inline-block;padding:10px 0;text-underline-offset:5px;font-size:14px}
.section-nav a[aria-current=page]{font-weight:700;text-decoration-thickness:2px}
.waves-image{opacity:.9}
@media(min-width:768px){.container{padding-inline:40px}}
@media(min-width:1280px){.container{padding-inline:64px}}
@media(min-width:701px){.brand{width:auto}.brand img{width:auto;height:55px}}
@media(min-width:1024px){.hero .container{padding-block:128px}.acrostico-wrapper{grid-template-columns:repeat(4,max-content)}.acro-col{font-size:clamp(22px,2.3vw,33px)}}
@media(min-width:640px) and (max-width:1023px){.acrostico-wrapper{grid-template-columns:repeat(2,max-content);gap:40px}.acro-col{font-size:clamp(22px,2.3vw,33px)}}
@media(max-width:639px){.acrostico-wrapper{grid-template-columns:max-content}.acro-col{font-size:22px}.acro-item{min-height:32px}}
@media(max-width:700px){.mobile-only{display:list-item}.header-links{max-height:calc(100dvh - 76px);overflow-y:auto}.header-links a{min-height:44px}.brand{width:auto}.brand img{width:auto;height:45px}.section-nav ul{display:grid;grid-template-columns:1fr 1fr;gap:8px 20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.acro-item:hover,.acro-item:focus-visible,.acro-item[aria-pressed=true],.acro-item:active{transform:none}}

/* Revisión de diseño 02. Borrador local: sin despliegue. */
@font-face{
  font-family:"Nunito Sans";
  font-style:normal;
  font-weight:800;
  font-display:swap;
  src:url("./fonts/nunito-sans-latin-800-normal.woff2") format("woff2");
}
.site-header{position:relative}
.site-header :focus-visible{outline:2px solid #fff;outline-offset:5px}
.header-links .discord-link{
  font-family:"Nunito Sans",var(--font);
  font-weight:800;
  letter-spacing:.025em;
  gap:16px;
  white-space:nowrap;
  border-bottom-color:transparent;
}
.discord-label,.header-links .discord-mark{
  display:inline-block;
  transition:color 180ms ease,transform 180ms ease;
}
.discord-label{transform-origin:right center}
.header-links .discord-mark{width:24px;height:24px;flex:none;transform-origin:center}
.header-links .discord-link:is(:hover,:focus-visible){color:#5865F2;border-bottom-color:transparent}
.discord-link:is(:hover,:focus-visible) .discord-label{transform:scale(1.025)}
.discord-link:is(:hover,:focus-visible) .discord-mark{transform:scale(1.15)}

.home .hero{border:0}
.home .hero>.container{padding-block:44px 28px}
.home .hero h1{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px}
.home .hero-logo{grid-column:3 / span 8;width:min(100%,630px);height:auto;margin:0}
.home .acrostico-section{border:0;padding:0;margin-top:36px}
.home .acrostico-wrapper{
  display:grid;
  grid-template-columns:repeat(4,max-content);
  justify-content:center;
  gap:clamp(12px,2vw,28px);
  width:max-content;
  max-width:100%;
  margin:0 auto;
}
.home .acro-col{font-size:clamp(16px,2.1vw,28px);line-height:1.2;padding:0 .9em 0 0}
.home .acro-col li{padding-block:3px}
.home .acro-item{padding:0;min-height:0;line-height:1.2}
.home .acro-selection{border:0;text-align:center;margin:16px 0 0;padding:0;min-height:22px;max-width:none;font-size:12px}
.home .statement{padding-block:36px 44px;gap:20px}
.home .statement blockquote{font-size:clamp(17.16px,1.716vw,23.4px);line-height:1.45}
.home .statement h2{font-size:17px}
.home .statement .index-num{font-size:12px}

@media(max-width:1023px){
  .home .hero h1{column-gap:20px}
  .home .hero-logo{grid-column:2 / span 10;width:84%;max-width:630px}
  .home .hero>.container{padding-top:32px}
}
@media(max-width:700px){
  .header-links{background:var(--ink)}
  .home .hero>.container{padding-inline:16px;padding-block:28px 20px}
  .home .hero h1{column-gap:12px}
  .home .hero-logo{grid-column:2 / span 10;width:84%;max-width:none}
  .home .acrostico-section{margin-top:28px}
  .home .acrostico-wrapper{grid-template-columns:repeat(4,max-content);gap:8px;justify-content:center}
  .home .acro-col{font-size:clamp(10px,3.2vw,20px);padding-right:.9em}
  .home .acro-selection{font-size:11px;margin-top:12px;min-height:18px}
  .home .statement{padding-block:28px 34px;gap:14px}
}
@media(prefers-reduced-motion:reduce){
  .discord-label,.header-links .discord-mark{transition:none!important;transform:none!important}
}

/* Revisión 03: misión y visión apiladas, comunidad y edición de contenidos. */
.home .statement{display:block;max-width:1120px;padding-block:34px 40px}
.home .statement .label{margin-bottom:16px}
.home .statement h2{font-size:clamp(21px,2vw,25px);line-height:1.25;font-weight:600}
.home .statement blockquote{font-size:clamp(16px,1.35vw,18px);line-height:1.65;max-width:85ch}
.home .statement blockquote p:last-child{margin-bottom:0}
.home .statement .index-num{font-size:11px;margin-bottom:7px}
.reading-width{max-width:1000px}
.cms-text{padding-block:64px 26px}
.cms-text h1{font-size:clamp(30px,3.6vw,48px);font-weight:600;line-height:1.16;margin-bottom:30px;max-width:21ch}
.cms-text h2{font-size:clamp(23px,2.4vw,32px);font-weight:600;line-height:1.25;margin-bottom:22px}
.prose{font-size:18px;line-height:1.75;max-width:78ch}
.prose p{margin-bottom:22px}.prose p:last-child{margin-bottom:0}.prose a{text-underline-offset:4px}
.cms-buttons{padding-block:12px 40px}.button-row{display:flex;gap:14px;flex-wrap:wrap}
.dilo-button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:49px;padding:13px 21px;border:1px solid currentColor;background:transparent;color:inherit;text-decoration:none;font-size:15px;font-weight:600;line-height:1.4;cursor:pointer;transition:background 160ms,color 160ms}
.dilo-button.primary{background:#141414;color:white;border-color:#141414}.dilo-button:hover{background:#141414;color:#fff}.dilo-button.primary:hover{background:#383838}.dilo-button:disabled{cursor:default;opacity:.65}.dilo-button:disabled:hover{background:inherit;color:inherit}.dilo-button.primary:disabled:hover{background:#141414;color:white}
.link-pending{font-size:13px;color:#6d6d6d;margin:14px 0 0}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:32px}.donation-action .dilo-button:hover{background:#fff;color:#141414}.donation-action .dilo-button:disabled:hover{background:transparent;color:inherit}
.community-rule{padding-block:42px;border-top:1px solid #dedede}.rule-heading{display:flex;gap:19px;align-items:flex-start;margin-bottom:24px}.rule-heading .eyebrow{margin-bottom:8px;font-size:11px;letter-spacing:.12em}.rule-heading h2{font-size:clamp(22px,2.1vw,28px);font-weight:600;line-height:1.28;margin-bottom:0}.rule-icon{font-size:26px;line-height:1.6;min-width:34px;flex:none}.rule-examples{margin-top:28px;border-left:2px solid #dedede;padding-left:24px}.rule-example{margin-bottom:23px}.rule-example:last-child{margin-bottom:0}.rule-example h3{font-size:15px;margin-bottom:7px;letter-spacing:0}.rule-example h3 span{display:inline-block;width:19px;color:#777}.rule-example .prose{font-size:16px;line-height:1.7}.cms-media{padding-block:28px}.cms-media figure{margin:0 auto}.cms-media img{width:100%;height:auto}.cms-media figcaption{font-size:13px;color:#6d6d6d;margin-top:12px}.cms-file{padding-block:28px}
@media(max-width:700px){.home .statement{padding-block:28px 34px}.home .statement .label{margin-bottom:14px}.home .statement h2{font-size:21px}.home .statement blockquote{font-size:16px}.cms-text{padding-block:40px 20px}.cms-text h1{font-size:31px}.prose{font-size:16px;line-height:1.75}.community-rule{padding-block:32px}.rule-heading{gap:12px}.rule-heading h2{font-size:22px}.rule-icon{font-size:23px;min-width:28px}.rule-examples{padding-left:16px;margin-top:23px}.rule-example .prose{font-size:15px}.button-row{gap:10px}.dilo-button{font-size:14px;padding:12px 17px}.footer-top{display:block}.donation-action{margin-top:28px}}

.rule-icon svg{display:block;width:28px;height:28px;margin-top:5px}
