/*
Theme Name: Dongabo Creative Space
Theme URI: https://darkgrey-elk-649469.hostingersite.com
Author: Gabo Núñez
Description: Editorial creative-space portfolio for Gabo Núñez.
Version: 4.2.0
Text Domain: dongabo-space
*/
@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400;500&family=Manrope:wght@400;500;600;700&display=swap');

:root{--ink:#242421;--paper:#f4f3ed;--soft:#e9e8e1;--card:#e5e4de;--orange:#dd5933;--dark:#292a26;--line:#cecdc5;--pad:clamp(1.4rem,5vw,5rem)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Manrope',sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.shell{width:min(100%,1440px);margin:0 auto}.eyebrow{font:500 .69rem/1.4 'DM Mono',monospace;letter-spacing:.13em;text-transform:uppercase}.accent{color:var(--orange)}

.site-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:2.2rem var(--pad)}.site-logo{width:220px;height:auto}.menu{display:flex;gap:2.4rem;font-size:.83rem}.top-link{justify-self:end;border-bottom:1px solid var(--ink);padding:.7rem 0;min-width:160px;display:flex;justify-content:space-between;font-size:.82rem}.menu a:hover,.top-link:hover{color:var(--orange)}

.hero{padding:clamp(5rem,11vw,10rem) var(--pad) 0}.hero-grid{display:grid;grid-template-columns:1.7fr .7fr;gap:5vw;align-items:end}.hero h1{margin:2.1rem 0 2rem;max-width:13ch;font-size:clamp(4rem,7.7vw,8.4rem);line-height:.92;letter-spacing:-.07em;font-weight:600}.hero-copy{max-width:42rem;color:#65645e;font-size:clamp(1rem,1.4vw,1.25rem);line-height:1.55}.hero-action{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}.spark{color:var(--orange);font-size:clamp(6rem,10vw,9rem);line-height:1}.button{display:flex;align-items:center;justify-content:space-between;gap:2rem;min-width:245px;padding:1.2rem 1.5rem;background:var(--ink);color:var(--paper);border:1px solid var(--ink);font-weight:600}.button.light{background:var(--paper);color:var(--ink);border-color:var(--paper)}.button:hover{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.hero-frame{margin-top:4.5rem;min-height:clamp(310px,43vw,620px);border:1px solid var(--line);background:var(--soft);padding:1.6rem;display:flex;flex-direction:column;justify-content:space-between;color:#77766f}.frame-center{text-align:center;font-size:clamp(1.4rem,2.6vw,2.6rem)}.frame-bottom{display:flex;justify-content:space-between}.hero-video{padding:0;aspect-ratio:16/9;min-height:0;background:#000;overflow:hidden}.hero-video iframe,.process-video iframe{display:block;width:100%;height:100%;border:0}

.ticker{margin-top:4rem;background:var(--orange);overflow:hidden;padding:1.6rem 0;white-space:nowrap}.ticker-track{display:inline-block;font-weight:700;font-size:1rem;word-spacing:2rem;animation:move 26s linear infinite}@keyframes move{to{transform:translateX(-50%)}}

.section{padding:clamp(7rem,12vw,12rem) var(--pad)}.section-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:5rem;align-items:end;margin-bottom:4rem}.section-intro h2{margin:1.8rem 0 0;max-width:12ch;font-size:clamp(3rem,6vw,6.3rem);line-height:.94;letter-spacing:-.065em}.section-intro p{max-width:36rem;margin:0;color:#66655f;line-height:1.65}
.resources{background:var(--paper)}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.resource-cover{height:340px;border:1px solid var(--line);background:var(--card);display:grid;place-items:center;color:#7b7a73}.resource:nth-child(2) .resource-cover{background:#dcddd7}.resource:nth-child(3) .resource-cover{background:#ebe6df}.resource-meta{display:flex;justify-content:space-between;margin:1.5rem 0;font:400 .62rem 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#66655f}.resource h3{margin:0;font-size:clamp(1.35rem,2.2vw,2rem);line-height:1.12;letter-spacing:-.03em}.resource p{min-height:5em;color:#66655f;line-height:1.55}.text-link{display:flex;justify-content:space-between;border-bottom:1px solid var(--ink);padding:1.2rem 0;font-weight:500}

.process{background:var(--dark);color:var(--paper)}.process-grid{display:grid;grid-template-columns:1fr .92fr;gap:clamp(4rem,7vw,8rem);align-items:center}.video-placeholder{aspect-ratio:1.28;border:1px solid #55564f;background:#33342f;padding:1.6rem;display:flex;flex-direction:column;justify-content:space-between;color:#a3a39b}.process-video{padding:0;aspect-ratio:16/9;overflow:hidden;background:#000}.play{align-self:center;margin:auto;width:72px;height:72px;border:1px solid #8f9088;border-radius:50%;display:grid;place-items:center;font-size:1.8rem}.process-copy h2{margin:1.8rem 0 2rem;font-size:clamp(3rem,5vw,5.5rem);line-height:.95;letter-spacing:-.06em}.process-copy p{color:#c4c4bd;line-height:1.7}.process-copy .button{margin-top:2rem}

.tools{background:var(--paper)}.tool-card{display:grid;grid-template-columns:100px 1fr auto;gap:2rem;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:1.8rem 0}.tool-icon{width:76px;height:76px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--paper);font-size:2rem;font-weight:700}.tool-card h3{margin:0 0 .5rem;font-size:1.5rem}.tool-card p{margin:0;color:#66655f}.tool-tag{font:400 .65rem 'DM Mono',monospace;letter-spacing:.12em;text-transform:uppercase}

.community{background:var(--soft)}.community-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(4rem,8vw,9rem)}.community-copy h2{margin:1.8rem 0 2rem;max-width:10ch;font-size:clamp(3rem,6vw,6.3rem);line-height:.93;letter-spacing:-.065em}.community-copy p{max-width:36rem;color:#62615b;line-height:1.7}.signoff{margin-top:4rem;font-size:1.1rem}.signoff strong{display:block;font-size:2.2rem;font-weight:500}.signup{background:var(--paper);padding:clamp(1.8rem,4vw,3.6rem)}.signup-title{display:flex;justify-content:space-between;margin-bottom:2rem}.field{display:block;margin:1.25rem 0}.field span{display:block;margin-bottom:.6rem;font-size:.85rem}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:transparent;padding:1rem;color:var(--ink)}.field textarea{min-height:110px;resize:vertical}.form-note{font-size:.75rem;line-height:1.5;color:#66655f}.signup .button{width:100%;margin-top:1.2rem}

.site-footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2rem;align-items:start;padding:4.5rem var(--pad) 2rem;background:var(--paper);border-top:1px solid var(--line)}.footer-logo{width:220px;height:auto}.footer-claim{font-size:1.4rem;line-height:1.3}.socials{display:flex;justify-content:flex-end;gap:1.5rem;font-size:.84rem}.footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;margin-top:3rem;padding-top:1.4rem;border-top:1px solid var(--line);font:400 .62rem 'DM Mono',monospace;letter-spacing:.1em;text-transform:uppercase}

@media(max-width:900px){.site-nav{grid-template-columns:1fr auto}.menu{display:none}.hero-grid,.section-intro,.process-grid,.community-grid{grid-template-columns:1fr}.hero-action{margin-top:2rem}.resource-grid{grid-template-columns:1fr}.resource-cover{height:280px}.resource p{min-height:auto}.site-footer{grid-template-columns:1fr 1fr}.socials{grid-column:1/-1;justify-content:flex-start}.section-intro{gap:2rem}}
@media(max-width:560px){.top-link{min-width:auto}.top-link span:first-child{display:none}.hero{padding-top:3rem}.hero h1{font-size:clamp(3.4rem,16vw,5rem)}.frame-bottom{flex-direction:column;gap:1rem}.tool-card{grid-template-columns:70px 1fr}.tool-tag{grid-column:2}.site-footer{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:.8rem}.ticker{padding:1.2rem 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.ticker-track{animation:none}}

/* Mobile editorial refinement, September 2026. */
.icon{width:22px;height:22px;flex-shrink:0;vertical-align:middle}
.hero-featured{margin-top:40px}.hero-featured .video-shell{width:100%}
.projects{background:var(--soft)}.project-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.project-controls>div{display:flex;gap:8px}.project-controls button{width:48px;height:48px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}.project-controls button:disabled{opacity:.3;cursor:default}.project-controls button:first-child svg{transform:rotate(-90deg)}.project-controls button:last-child svg{transform:rotate(90deg)}.project-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0;align-items:flex-start;padding:4px 4px 24px;scrollbar-color:var(--orange) var(--line)}.project-card{flex:0 0 calc((100% - 24px)/2.3);min-width:0;scroll-snap-align:start;background:var(--paper)}.project-cover{height:240px;padding:24px;background:var(--orange);position:relative;display:flex;flex-direction:column;justify-content:space-between}.project-cover strong{font-size:100px;line-height:1;letter-spacing:-.08em;font-weight:500}.project-cover>svg{position:absolute;right:24px;bottom:24px;width:64px;height:64px}.project-card:nth-child(2) .project-cover{background:var(--ink);color:var(--paper)}.project-card:nth-child(3) .project-cover{background:#d9d4be}.project-card:nth-child(4) .project-cover{background:#39443a;color:var(--paper)}.project-body{padding:24px}.project-body h3{font-size:28px;letter-spacing:-.04em;margin:16px 0 24px}.project-body summary{display:flex;align-items:center;justify-content:space-between;list-style:none;cursor:pointer;border-top:1px solid var(--line);padding:16px 0;min-height:48px}.project-body summary::-webkit-details-marker{display:none}.project-body details[open] summary svg{transform:rotate(90deg)}.project-detail{font-size:16px;line-height:1.6;color:#62615b}.project-detail dt{font-weight:700;color:var(--ink);margin-top:16px}.project-detail dd{margin:4px 0}.project-track:focus-visible,.project-body summary:focus-visible{outline:3px solid #ad391d;outline-offset:3px}@media(max-width:900px){.project-card{flex-basis:85%}.project-cover{height:200px}.project-body{padding:20px}.project-cover strong{font-size:80px}.project-cover>svg{width:48px;height:48px}}
.menu a:hover,.top-link:hover{color:#a5361c}
a:focus-visible,button:focus-visible{outline:3px solid #ad391d;outline-offset:5px}
.process a:focus-visible{outline-color:#ffad8e}
.skip-link{position:absolute;top:0;left:20px;z-index:10;padding:16px;background:var(--ink);color:var(--paper);transform:translateY(-150%)}.skip-link:focus{transform:none}
section[id]{scroll-margin-top:24px}
.site-nav{gap:24px;padding-top:24px;padding-bottom:24px}.site-logo{display:block;width:208px}.menu{gap:24px}.menu a,.socials a{display:inline-flex;align-items:center;gap:6px;min-height:44px}.top-link{gap:16px;min-height:44px}.menu-toggle{display:none}.menu[hidden]{display:none}
.hero{padding-top:64px}.hero h1{font-size:clamp(3rem,7.2vw,7rem);line-height:1.02;margin:24px 0;letter-spacing:-.065em}.hero-copy{margin-bottom:0}.hero-action{gap:16px}.spark .icon{width:88px;height:88px}.button{min-height:48px;min-width:0;gap:16px}.hero-action .button,.secondary-action{width:100%}.secondary-action{min-height:48px;padding:12px 0;align-items:center;gap:12px}.hero-action .spark{margin-bottom:12px}
.ticker{margin-top:56px;padding:20px 0}.ticker-track{display:flex;align-items:center;width:max-content;gap:36px;word-spacing:normal;text-transform:uppercase}.ticker-track .icon{width:24px;height:24px}
.section{padding-top:88px;padding-bottom:88px}.section-intro{margin-bottom:40px;gap:48px}.section-intro h2,.community-copy h2{font-size:clamp(2.5rem,5.4vw,5.3rem);line-height:1.02}.section-intro p,.resource p,.process-copy p,.community-copy p,.tool-card p,.contact-card p{font-size:16px;line-height:1.65}
.resource-cover{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;height:290px;padding:24px;color:var(--ink);background:var(--orange);border:0;overflow:hidden}.resource-cover strong{font-size:clamp(2rem,3.2vw,3.4rem);font-weight:600;line-height:1;letter-spacing:-.055em}.resource-cover>.icon{position:absolute;right:22px;top:22px;width:38px;height:38px}.resource:nth-child(2) .resource-cover{background:var(--ink);color:var(--paper)}.resource:nth-child(3) .resource-cover{background:#e5dfcc;color:#242421}.resource-meta{flex-wrap:wrap;gap:10px;line-height:1.5;letter-spacing:.055em;margin:20px 0 14px;color:#55544f}.status{border:1px solid #9c9b92;padding:3px 7px}.resource-meta>span:first-child{padding:4px 0}.resource p{min-height:0;margin-bottom:0}
.process-grid{gap:48px}.process-copy h2{line-height:1.03}.process .accent{color:#f0805e}.video-facade{position:relative;aspect-ratio:16/9;background:#161714}.video-trigger{display:block;position:relative;width:100%;height:100%;overflow:hidden}.video-trigger img{display:block;width:100%;height:100%;object-fit:cover}.video-trigger::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,#0009)}.video-label{position:absolute;z-index:1;bottom:16px;left:16px;right:16px;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px;background:var(--paper);color:var(--ink);font-weight:600}.video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.video-external{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-height:44px;font-size:13px;text-decoration:underline;text-underline-offset:4px}.more-work{display:grid;grid-template-columns:1fr .92fr;gap:48px;align-items:center;margin-top:48px;padding-top:40px;border-top:1px solid #56574f}.more-work h3{font-size:clamp(1.6rem,3vw,2.6rem);font-weight:500;letter-spacing:-.04em;max-width:20ch}.tool-tag{display:flex;align-items:center;gap:12px}
.contact-card{background:var(--paper);padding:36px;align-self:center;min-width:0}.contact-card h3{font-size:32px;letter-spacing:-.045em;line-height:1.15}.contact-email{display:block;font-size:clamp(1rem,1.8vw,1.5rem);text-decoration:underline;text-underline-offset:5px;overflow-wrap:anywhere;padding:12px 0;margin:16px 0}.contact-card .button{width:100%}.contact-card .form-note{font-size:13px}.community-grid{gap:48px}.signoff{margin-top:32px}.footer-logo{display:block;width:208px}.site-footer{grid-template-columns:1fr 1fr;gap:32px;padding-top:48px}.socials{grid-column:1/-1;justify-content:flex-start;flex-wrap:wrap}.footer-bottom{margin-top:8px;align-items:center;gap:16px}.footer-bottom a{display:flex;align-items:center;gap:8px;min-height:44px}
@media(max-width:1100px){.site-nav{grid-template-columns:auto 1fr}.menu{grid-column:1/-1;grid-row:2;justify-content:center}.top-link{grid-column:2;grid-row:1}}
@media(max-width:900px){
 :root{--pad:24px}.site-nav{grid-template-columns:1fr auto;gap:12px}.site-logo{width:168px}.js .menu-toggle{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 12px;background:transparent;border:1px solid var(--line);color:var(--ink)}.menu{display:flex;grid-column:1/-1;grid-row:3;flex-direction:column;gap:0;border-top:1px solid var(--line);padding-top:8px}.menu a{min-height:48px}.top-link{grid-column:1/-1;grid-row:2;justify-self:stretch;min-width:0;max-width:none;justify-content:space-between;font-size:14px}.top-link span:first-child{display:inline}
 .hero{padding-top:36px}.hero-grid{gap:28px}.hero-action{display:grid;grid-template-columns:1fr auto;margin-top:0;align-items:center;gap:12px 20px}.hero-action .spark{grid-column:2;grid-row:1/3;margin:0}.spark .icon{width:48px;height:48px}.hero-action .button,.secondary-action{grid-column:1}.hero h1{font-size:clamp(2.8rem,8.4vw,4.8rem);max-width:14ch;letter-spacing:-.06em;margin:20px 0}.hero-copy{max-width:42ch}.ticker{margin-top:36px;padding:16px 0}.ticker-track{font-size:13px;gap:24px}
 .section{padding-top:56px;padding-bottom:56px}.section-intro{gap:20px;margin-bottom:28px}.section-intro h2,.community-copy h2,.process-copy h2{font-size:clamp(2.3rem,7.4vw,4rem);line-height:1.06;letter-spacing:-.055em;margin:16px 0 20px;max-width:17ch}.section-intro h2{margin-bottom:0}.resource-grid{gap:32px}.resource-cover{height:180px;padding:20px}.resource-cover strong{font-size:36px}.resource-cover>.icon{width:32px;height:32px}.resource-meta{margin:16px 0 12px}.resource h3{font-size:24px;max-width:26ch}.resource p{margin-top:12px;max-width:48ch}.process-grid,.more-work,.community-grid{grid-template-columns:1fr;gap:28px}.process-copy .button{margin-top:24px}.more-work{margin-top:32px;padding-top:28px;gap:8px}.more-work h3{margin:12px 0 16px;max-width:24ch}.tool-card{grid-template-columns:56px 1fr;gap:16px}.tool-icon{width:48px;height:48px;font-size:24px}.tool-tag{grid-column:2}.contact-card{padding:24px}.site-footer{grid-template-columns:1fr;padding-top:36px;gap:24px}.footer-logo{width:180px}.footer-claim{font-size:21px}.footer-bottom{align-items:flex-start;flex-direction:column;gap:12px}.socials{gap:16px}.footer-bottom a{padding:4px 0}.form-note{font-size:13px}
}
@media(max-width:390px){:root{--pad:20px}.hero h1{font-size:44px}.hero-action{gap:10px}.spark .icon{width:36px;height:36px}.button{padding:14px 16px;font-size:14px}.contact-card{padding:20px}.resource-meta{font-size:10px;letter-spacing:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
