/* About, services and projects chapters: framed cards, blueprint grids and a clearer hierarchy. */
:root{--blueprint:linear-gradient(#c4a57212 1px,transparent 1px),linear-gradient(90deg,#c4a57212 1px,transparent 1px)}

/* About — hero facts card */
@media(min-width:701px){.about-hero{grid-template-columns:1.25fr 1fr}}
.about-facts{position:relative;z-index:1;align-self:center;border:1px solid #c4a57266;background:linear-gradient(160deg,#c4a5721a,#1d201a 45%);padding:38px 40px 30px;box-shadow:0 30px 70px #0006}
.about-facts:before,.about-facts:after{content:'';position:absolute;width:22px;height:22px;border:2px solid var(--gold)}
.about-facts:before{top:-7px;right:-7px;border-left:0;border-bottom:0}
.about-facts:after{bottom:-7px;left:-7px;border-right:0;border-top:0}
.about-year{display:flex;align-items:baseline;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);padding-bottom:18px}
.about-year span{font-size:14px;color:var(--gold);letter-spacing:.06em}
.about-year strong{font-size:clamp(72px,7vw,112px);font-weight:600;line-height:1;letter-spacing:-.06em;color:var(--gold)}
.about-facts dl{margin:8px 0 0}
.about-facts dl>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid #c4a5721f}
.about-facts dt{font-size:13px;color:var(--muted);padding-top:3px}
.about-facts dd{margin:0;font-size:18px;font-weight:500}
.about-motto{margin:22px 0 0;font-family:Gveret,serif;font-size:30px;color:var(--gold);line-height:1.4}

/* About — story, clients and values */
.about-page .editorial{position:relative;overflow:hidden}
.about-page .editorial:after{content:'2013';position:absolute;left:4%;bottom:-.2em;font-size:clamp(140px,19vw,300px);font-weight:700;letter-spacing:-.07em;line-height:1;color:transparent;-webkit-text-stroke:1px #c4a5721c;pointer-events:none}
.about-page .editorial>div:last-child{position:relative;z-index:1;border-inline-start:2px solid var(--gold);padding-inline-start:clamp(24px,4vw,56px)}
.about-page .client-section{background:var(--blueprint),#1b1e18;background-size:32px 32px,auto}
.about-page .client-list{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;border:0;margin-top:55px}
.about-page .client-list>span{display:flex;flex-direction:column;gap:22px;margin:0;padding:26px 22px 24px;border:1px solid var(--line);background:#141512cc;font-size:clamp(18px,1.6vw,23px);font-weight:500;color:var(--white)}
.about-page .client-list>span:hover{border-color:var(--gold);background:#1d201a}
.about-page .client-list svg{width:34px;height:34px;color:var(--gold);stroke-width:1.2}
.about-page .values{gap:20px;padding-top:85px;counter-reset:value}
.about-page .values article{position:relative;overflow:hidden;counter-increment:value;border:1px solid var(--line);border-top:2px solid var(--gold);background:linear-gradient(180deg,#1d201a,#141512);padding:34px 30px 36px}
.about-page .values article:after{content:'0' counter(value);position:absolute;left:18px;top:10px;font-size:96px;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:1px #c4a57230;pointer-events:none}
.about-page .values article>span{display:block;font-size:13px;letter-spacing:.06em}
.about-page .values article:hover{border-color:#c4a57288}

/* Services — hero shortcuts replace the repeated illustration */
.service-index{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.service-index a{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:38px;min-height:170px;padding:22px;border:1px solid var(--line);background:var(--blueprint),#1a1c17;background-size:24px 24px,auto}
.service-index a:hover{border-color:var(--gold);background-color:#1d201a}
.service-index span{font-size:13px;color:var(--gold)}
.service-index strong{font-size:clamp(19px,1.7vw,25px);font-weight:600;line-height:1.3}
.service-index svg{position:absolute;left:20px;top:20px;color:var(--gold);transition:transform .3s}
.service-index a:hover svg{transform:translate(-5px,5px)}

/* Services — accordion rows become cards */
.services-page .services-list{display:grid;gap:14px;padding-top:60px}
.services-page .service-row{border:1px solid var(--line);background:#171915;padding:0 clamp(20px,3vw,44px);transition:border-color .3s,background-color .3s}
.services-page .service-row[open]{background:var(--surface);border-color:#c4a57266}
.services-page .service-row summary{grid-template-columns:90px 1fr 36px;padding:26px 0}
.services-page .service-number{font-size:52px;font-weight:700;line-height:1;padding:0;align-self:center;color:transparent;-webkit-text-stroke:1px var(--gold)}
.services-page .service-row summary h2{font-size:clamp(28px,3.2vw,48px);transition:color .25s}
.services-page .service-row summary:hover h2{color:var(--gold)}
.services-page .service-panel{border-top:1px solid var(--line);padding:36px 0 44px}
.services-page .service-panel .line-art{border:1px solid var(--line);background:var(--blueprint),#141512;background-size:28px 28px,auto;padding:22px}

/* Projects — framed illustration and card grid */
.projects-page .page-hero .line-art{border:1px solid var(--line);background:var(--blueprint),#171915;background-size:28px 28px,auto;padding:26px}
.projects-page .project-types{grid-template-columns:repeat(2,1fr);gap:16px}
.projects-page .project-type{grid-template-columns:120px 1fr auto;grid-template-areas:"art label arrow" "art title arrow";column-gap:26px;row-gap:6px;padding:22px 24px;border:1px solid var(--line);background:#171915}
.projects-page .project-type:hover{border-color:var(--gold);background:var(--surface)}
.projects-page .project-type img{grid-area:art;width:120px;height:92px;object-fit:contain;border:1px solid #c4a5721f;background:var(--blueprint),#141512;background-size:16px 16px,auto}
.projects-page .project-type>span{grid-area:label;align-self:end}
.projects-page .project-type h3{grid-area:title;align-self:start;font-size:clamp(22px,2vw,28px)}
.projects-page .project-type svg{grid-area:arrow;width:44px;height:44px;padding:11px;border:1px solid #c4a57266;border-radius:50%;color:var(--gold)}
.projects-page .project-type:hover svg{background:var(--gold);color:var(--ink)}
.projects-page .portfolio-note{background:var(--blueprint),var(--surface);background-size:32px 32px,auto}

@media(max-width:1000px){.about-page .client-list{grid-template-columns:repeat(3,1fr)}.about-facts{padding:32px 28px 26px}.service-index a{min-height:140px}.projects-page .project-type{grid-template-columns:90px 1fr auto;column-gap:18px}.projects-page .project-type img{width:90px;height:72px}}
@media(max-width:700px){
.about-facts{padding:30px 22px 24px}.about-facts dl>div{grid-template-columns:96px 1fr;gap:12px}.about-facts dd{font-size:16px}.about-motto{font-size:26px}
.about-page .editorial>div:last-child{padding-inline-start:20px}
.about-page .client-list{grid-template-columns:1fr 1fr;gap:10px;margin-top:35px}.about-page .client-list>span{padding:18px 16px;gap:14px;font-size:18px}.about-page .client-list>span:last-child{grid-column:1/-1}
.about-page .values{gap:14px;padding-top:60px}.about-page .values article{padding:28px 22px 30px}
.service-index{gap:10px}.service-index a{min-height:120px;padding:16px;gap:22px}.service-index strong{font-size:18px}.service-index svg{left:14px;top:14px;width:18px;height:18px}
.services-page .services-list{gap:10px;padding-top:40px}.services-page .service-row{padding:0 18px}.services-page .service-row summary{grid-template-columns:48px 1fr 24px;padding:20px 0}.services-page .service-number{font-size:26px;font-weight:600;color:var(--gold);-webkit-text-stroke:0}.services-page .service-row summary h2{font-size:25px}.services-page .service-panel{padding:26px 0 30px}.services-page .service-panel .line-art{padding:14px}
.projects-page .page-hero .line-art{padding:16px}
.projects-page .project-types{grid-template-columns:1fr;gap:12px}.projects-page .project-type{grid-template-columns:76px 1fr auto;column-gap:14px;padding:14px}.projects-page .project-type img{width:76px;height:62px}.projects-page .project-type h3{font-size:21px}.projects-page .project-type svg{width:38px;height:38px;padding:9px}
}
html[data-motion="reduced"] .service-index svg,html[data-motion="reduced"] .services-page .service-row,html[data-motion="reduced"] .services-page .service-row summary h2{transition:none}