/*
Theme Name: Croquis Estudio
Author: Croquis Estudio
Description: Arquitectura, diseño y construcción. Identidad aprobada v1.1.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: croquis-estudio
*/
@font-face{font-family:General;src:url('assets/general-400.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:General;src:url('assets/general-700.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--bone:#eae8df;--black:#191a17;--line:#b9bbb1;--muted:#66695e}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bone);color:var(--black);font-family:General,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid currentColor;outline-offset:7px}.skip{position:fixed;top:-90px;left:20px;padding:15px;background:var(--bone);z-index:100}.skip:focus{top:10px}header{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;justify-content:space-between;align-items:center;padding:28px 4%}.brand{display:flex;align-items:center;gap:14px}.brand span{font-weight:700;font-size:42px;letter-spacing:-2px;line-height:1}.brand svg{width:26px;height:35px}svg path{fill:none;stroke:currentColor;stroke-width:6;stroke-linejoin:miter}svg circle{fill:currentColor}.menu-button{background:none;border:0;padding:12px 0 12px 20px;font-size:14px;display:flex;align-items:center;gap:28px}.menu-button span{font-size:26px}.hero{padding:122px 4% 0}.hero-meta{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.08em;margin-bottom:35px}.hero-stage{position:relative;isolation:isolate;min-height:720px;height:calc(100svh - 180px);max-height:1000px}.hero-photo{position:absolute!important;right:0;top:0;width:64%;height:100%;z-index:-1}.photo{display:block;position:relative;padding:0;border:0;background:#9b9e91;overflow:hidden;width:100%;text-align:left}.photo img{display:block;width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .8s ease,transform 1.2s cubic-bezier(.2,.65,.3,1)}.photo:hover img,.photo:focus-visible img,.photo.is-color img{filter:grayscale(0);transform:scale(1.025)}.photo-hint{position:absolute;bottom:20px;right:20px;color:#fff;font-size:12px;letter-spacing:.06em;mix-blend-mode:difference}.hero h1{color:#fff;mix-blend-mode:difference;font-size:clamp(80px,9.9vw,170px);line-height:.93;font-weight:700;letter-spacing:-.065em;margin:0;position:absolute;left:0;top:15%;pointer-events:none}.hero h1 span{white-space:nowrap}.hero-number{position:absolute;bottom:20px;left:0;font-size:12px;letter-spacing:.12em}.hero-foot{display:flex;justify-content:space-between;align-items:center;padding:28px 0 45px;gap:20px}.hero-foot p{font-size:16px;line-height:1.4;margin:0}.sample{font-size:12px;color:var(--muted);line-height:1.5}.discover{display:flex;align-items:center;gap:50px;font-size:14px}.discover span{font-size:32px}.section{padding:95px 4%}.section-label{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:18px;font-size:12px;letter-spacing:.09em}.intro-grid{display:grid;grid-template-columns:1fr 2fr;gap:7%;padding-top:80px}.big-portal svg{width:90px;height:120px}.intro h2{font-size:clamp(38px,4.6vw,76px);line-height:1.08;letter-spacing:-.04em;font-weight:400;margin:0 0 35px}em{font-family:Georgia,serif;font-weight:400}.intro p{font-size:18px;line-height:1.65;max-width:610px}.projects{background:var(--black);color:var(--bone);--muted:#b2b5a9;--line:#505348}.projects-heading{display:flex;justify-content:space-between;gap:70px;align-items:end;padding:65px 0}.projects-heading h2{font-size:clamp(65px,8vw,135px);line-height:.9;letter-spacing:-.06em;margin:0}.projects-heading p{max-width:330px;font-size:16px;line-height:1.65}.projects-heading .sample{display:block;margin-top:20px}.project-wide .photo{height:650px}.project-row{display:flex;align-items:baseline;gap:20px;border-bottom:1px solid var(--line);padding:24px 0 18px}.index{font-size:12px}.project h3{font-size:32px;letter-spacing:-.03em;font-weight:400;margin:0}.project-row>span:last-child:not(.index){margin-left:auto;font-size:12px}.project details{border-bottom:1px solid var(--line)}summary{padding:18px 0;cursor:pointer;list-style:none;font-size:14px;display:flex;justify-content:space-between}summary::-webkit-details-marker{display:none}details[open] summary span{transform:rotate(45deg)}details p{font-size:16px;line-height:1.65;max-width:550px}details a{text-decoration:underline;text-underline-offset:3px}.project-pair{display:grid;grid-template-columns:1fr 1fr;gap:7%;padding-top:90px}.project-pair .offset{padding-top:170px}.tall{height:530px}.process-grid{display:grid;grid-template-columns:1fr 1fr;gap:10%;padding-top:75px}.process h2{font-size:clamp(55px,6.6vw,110px);line-height:.95;letter-spacing:-.055em;margin:0}.steps>div{position:relative;padding:0 0 25px 50px;margin-bottom:30px;border-bottom:1px solid var(--line)}.steps span{position:absolute;left:0;top:6px;font-size:12px}.steps h3{font-size:28px;font-weight:400;margin:0 0 12px}.steps p{font-size:16px;line-height:1.65;margin:0;max-width:460px}.closing-image{position:relative;isolation:isolate}.closing-image .photo{height:650px}.closing-image img{object-position:center 70%}.closing-image p{position:absolute;top:50%;transform:translateY(-50%);left:4%;font-size:clamp(45px,7.5vw,120px);line-height:1;letter-spacing:-.05em;color:white;mix-blend-mode:difference;pointer-events:none;margin:0;font-weight:700}footer h2{font-size:clamp(58px,8vw,130px);line-height:1;letter-spacing:-.05em;margin:70px 0 50px;font-weight:400}.contact-row{display:flex;justify-content:space-between;align-items:center;gap:40px;font-size:16px;line-height:1.5}.pending{font-size:14px}.pending small{display:block;margin:8px 0 0 15px;color:var(--muted);font-size:12px}.pending-dot{display:inline-block;width:6px;height:6px;background:currentColor;border-radius:50%;margin-right:9px}.back-top{border:1px solid var(--line);border-radius:50%;width:60px;height:60px;display:grid;place-items:center;font-size:30px}.footer-word{font-size:clamp(95px,23vw,380px);font-weight:700;line-height:1.2;letter-spacing:-.065em;margin-top:70px;white-space:nowrap}.footer-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:12px}.footer-bottom button{padding:0;border:0;background:none;text-decoration:underline;font-size:12px}dialog{background:var(--black);color:var(--bone);border:0;width:100%;max-width:none;height:100svh;max-height:none;margin:0;padding:30px 6%;overflow:auto}dialog::backdrop{background:var(--black)}.menu-top{display:flex;justify-content:space-between;align-items:center}.menu-top>span{font-weight:700;font-size:42px;letter-spacing:-2px}.menu-top button{background:none;border:0;font-size:16px;padding:15px}dialog nav{padding:60px 0}dialog nav a{display:flex;gap:25px;align-items:baseline;font-size:clamp(35px,6.8vw,110px);font-weight:700;letter-spacing:-.045em;border-bottom:1px solid #505348;line-height:1.5}dialog nav small{font-size:12px;font-weight:400;letter-spacing:0}dialog nav a>span{margin-left:auto;font-weight:400;transition:transform .25s}dialog nav a:hover>span{transform:translate(8px,-8px)}.menu-bottom{display:flex;justify-content:space-between;font-size:12px;line-height:1.6}body.menu-visible{overflow:hidden}.no-motion *, .no-motion *::before,.no-motion *::after{transition:none!important;animation:none!important}html.no-motion{scroll-behavior:auto}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}@media(max-width:800px){header{padding:22px 5%}.brand span{font-size:34px}.brand svg{width:22px;height:30px}.hero{padding:110px 5% 0}.hero-meta{font-size:12px;line-height:1.5;gap:30px}.hero-meta span{max-width:160px}.hero-meta span:last-child{text-align:right}.hero-stage{min-height:530px;height:70svh;max-height:740px}.hero-photo{width:87%;top:65px;height:calc(100% - 65px)}.hero h1{font-size:clamp(52px,10.5vw,84px);top:30px;line-height:1.02}.hero-number{bottom:30px;writing-mode:vertical-rl}.hero-foot{flex-wrap:wrap}.hero-foot>.sample{display:none}.discover{gap:18px}.section{padding:65px 5%}.section-label{font-size:12px;line-height:1.4}.section-label span:last-child{text-align:right}.intro-grid{grid-template-columns:1fr;padding-top:45px;gap:35px}.big-portal svg{width:42px;height:55px}.intro p{font-size:16px}.projects-heading{display:block;padding:45px 0}.projects-heading p{margin-top:30px;max-width:100%}.project-wide .photo{height:400px}.project-row{flex-wrap:wrap;gap:12px}.project h3{font-size:26px}.project-row>span:last-child:not(.index){display:none}.project-pair{grid-template-columns:1fr;gap:55px;padding-top:55px}.project-pair .offset{padding-top:0}.tall{height:430px}.process-grid{grid-template-columns:1fr;gap:45px;padding-top:45px}.closing-image .photo{height:430px}.closing-image p{font-size:10vw;left:5%}.contact-row{flex-wrap:wrap;gap:20px}.pending{max-width:230px}.footer-word{margin-top:40px}.footer-bottom{flex-wrap:wrap}.menu-bottom{gap:25px}dialog nav{padding:55px 0}dialog nav a{line-height:1.8}.photo-hint{font-size:12px;right:14px;bottom:14px}}

.hero-stage{background:var(--bone)}.hero .hero-photo{width:64%;z-index:0}.hero h1{z-index:1}@media(max-width:800px){.hero .hero-photo{width:87%}}

:root{--accent:#ed642d}.brand-dot{color:var(--accent)}svg circle{fill:var(--accent)}.footer-word{display:flex;align-items:center;gap:3%;font-size:clamp(60px,18.7vw,310px);line-height:1.2}.footer-word>svg{width:.61em;height:.8em;flex:none}.footer-word>span{display:block}

/* The text defines the studio row height; the mark scales within that row. */
.intro-grid{grid-template-columns:40% minmax(0,1fr);gap:7%;align-items:stretch}
.big-portal{position:relative;display:block;min-width:0}
.big-portal img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:left center}
.intro-grid>div>p:last-child{margin-bottom:0}
@media(max-width:800px){
 .intro-grid{grid-template-columns:minmax(0,1fr);gap:36px}
 .big-portal{height:clamp(180px,48vw,280px)}
 .big-portal img{width:auto;height:100%;max-width:100%}
}

/* Approved identity: the logo contours are assets, never live typography. */
.brand-logo{display:block;width:clamp(170px,18vw,240px);height:auto}
.brand,.menu-brand{flex-shrink:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.footer-signature{margin:70px 0 28px;background:var(--black);color:var(--bone)}
/* Keep the approved logo, vertical divider and services as one composition. */
.signature-lockup{display:block;width:100%;height:auto}
.signature-lockup text{font-family:General,Arial,sans-serif;font-kerning:none}
@media(max-width:600px){
 .footer-signature{margin-top:40px}
}

/* WordPress integration */
body.admin-bar>header{top:32px}
.contact-links{display:flex;flex-direction:column;gap:12px;overflow-wrap:anywhere}
.contact-links a{text-decoration:underline;text-underline-offset:5px}
.wp-content-page{max-width:1000px;margin:0 auto;padding:60px 5%;min-height:80vh;line-height:1.65}
.wp-content-page img{max-width:100%;height:auto}
@media(max-width:782px){body.admin-bar>header{top:46px}}
/* Editable portfolio, extending the approved Croquis composition. */
.portfolio-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px 7%;align-items:start}
.portfolio-card:first-child{grid-column:1/-1}
.portfolio-card:nth-child(2n+3){margin-top:150px}
.project-cover{height:530px}
.portfolio-card:first-child .project-cover{height:650px}
.project-no-cover{display:grid;place-items:center;height:100%;background:var(--bone)}
.project-no-cover img{width:100px;height:160px;object-fit:contain;filter:none}
.project-facts{font-size:14px;line-height:1.6;letter-spacing:.02em}
.project-excerpt{font-size:16px;line-height:1.65;max-width:650px}
.project-visit{display:flex;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--line);font-size:16px}
.portfolio-all{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:80px;padding-top:25px;font-size:clamp(22px,3vw,40px)}
.project-header-link{font-size:16px;white-space:nowrap}
.project-detail{padding:150px 4% 90px}
.project-return{font-size:16px;text-decoration:underline;text-underline-offset:5px}
.project-title-block{padding-top:65px;padding-bottom:50px}
.project-title-block h1{font-size:clamp(52px,8vw,140px);letter-spacing:-.055em;line-height:1.02;margin:25px 0 30px;overflow-wrap:anywhere}
.project-kicker{font-size:14px;letter-spacing:.08em}
.project-detail-cover{margin:0 0 60px}
.project-detail-cover img{display:block;width:100%;height:auto;max-height:900px;object-fit:cover}
.project-body{font-size:18px;line-height:1.75;max-width:1100px;margin:0 auto;overflow-wrap:anywhere}
.project-body>p,.project-body>h2,.project-body>h3,.project-body>ul,.project-body>ol{max-width:780px}
.project-body img{max-width:100%;height:auto}
.project-body .wp-block-gallery{margin:45px 0;gap:20px}
.project-body .wp-block-image{margin-left:0;margin-right:0}
.project-body figcaption{font-size:14px;line-height:1.5}
.project-body a,.project-credit a{text-decoration:underline;text-underline-offset:4px}
.project-credit{max-width:1100px;margin:40px auto 0;padding-top:20px;border-top:1px solid var(--line)}
.project-site-footer .contact-row{margin:45px 0}
.project-archive{padding-top:110px}
.project-archive .project-title-block{padding-bottom:65px}
.project-archive .projects{padding-top:65px}
.navigation.pagination{margin-top:65px;font-size:18px}
.nav-links{display:flex;flex-wrap:wrap;gap:22px}
.page-numbers.current{text-decoration:underline;text-underline-offset:6px}
.project-body .wp-block-gallery img{filter:none}
@media(max-width:800px){
 .portfolio-grid{grid-template-columns:minmax(0,1fr);gap:55px}
 .portfolio-card:nth-child(2n+3){margin-top:0}
 .project-cover,.portfolio-card:first-child .project-cover{height:430px}
 .project-detail{padding:120px 5% 60px}
 .project-title-block{padding-top:40px;padding-bottom:30px}
 .project-detail-cover{margin-bottom:35px}
 .project-body{font-size:16px}
 .project-header-link{font-size:14px}
 .portfolio-all{margin-top:55px}
 .project-body .wp-block-gallery{gap:12px}
}