/* Designic Next — independent homepage art direction. */
body.designic-home {
    --next-paper: #e8e6df;
    --next-ink: #080c0e;
    --next-orange: var(--designic-accent);
    background: #070b0d;
}

/* Split-screen cinematic opening. */
body.designic-home .designic-hero {
    min-height: 100svh;
    align-items: stretch;
    background-size: auto 100%;
    background-position: right center;
    background-repeat: no-repeat;
    background-color: #05090b;
}
body.designic-home .designic-hero::after {
    content: "01  /  ORIGIN";
    position: absolute;
    z-index: 2;
    right: clamp(28px, 4vw, 68px);
    bottom: clamp(28px, 4vw, 58px);
    color: rgba(255,255,255,.72);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .2em;
}
body.designic-home .designic-hero::before {
    background:
        linear-gradient(90deg, #05090b 0%, #05090b 41%, rgba(5,9,11,.92) 48%, rgba(5,9,11,.08) 75%),
        linear-gradient(0deg, rgba(5,9,11,.7), transparent 35%);
}
body.designic-home .designic-hero-inner {
    grid-template-columns: minmax(0, .88fr) minmax(320px, 1.12fr);
    grid-template-rows: 1fr auto;
    align-items: center;
}
body.designic-home .designic-hero-copy { max-width: 720px; }
body.designic-home .designic-eyebrow {
    display: flex;
    align-items: center;
    gap: 13px;
    color: rgba(255,255,255,.62);
}
body.designic-home .designic-eyebrow::before { content:""; width: 30px; height: 1px; background: var(--next-orange); }
body.designic-home .designic-hero h1 {
    max-width: 780px;
    font-size: clamp(62px, 8vw, 138px);
    font-weight: 540;
    letter-spacing: -.072em;
    line-height: .79;
}
body.designic-home .designic-hero h1 br + * { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.75); }
body.designic-home .designic-hero-disciplines { margin-top: 30px; color: var(--next-orange); }
body.designic-home .designic-hero-note {
    align-self: end;
    max-width: 300px;
    margin: 0 0 14vh auto;
    padding: 0;
    font-size: 14px;
}
body.designic-home .designic-hero-note::before { display:none; }
body.designic-home .designic-scroll-cue { margin-top: 25px; }

/* Editorial section numbering. */
body.designic-home .designic-section { padding-top: clamp(90px, 10vw, 155px); }
body.designic-home .designic-section-heading { align-items: flex-end; border-bottom: 1px solid rgba(255,255,255,.2); padding-bottom: 20px; }
body.designic-home .designic-section-heading > div { width: 100%; justify-content: space-between; }
body.designic-home .designic-section-heading > div > span { order: 2; font-size: 11px; letter-spacing: .18em; }
body.designic-home .designic-section-heading h2 { font-size: clamp(32px, 5.1vw, 76px); font-weight: 500; letter-spacing: -.055em; text-transform: none; }

/* Selected Work keeps the compact horizontal carousel from the original Designic theme. */
body.designic-home .designic-work { padding-top: clamp(75px, 8vw, 120px); }

/* Four Creative Worlds — each image directly represents its discipline. */
body.designic-home .designic-services {
    margin-top: clamp(90px, 12vw, 180px);
    padding-bottom: clamp(90px, 10vw, 150px);
    background: #070b0e;
    color: #fff;
}
body.designic-home .designic-services .designic-section-heading { border-color: rgba(255,255,255,.2); }
body.designic-home .designic-services .designic-section-heading h2 { color: #f5f3ee; }
.designic-worlds { display:flex; width:100%; min-height:clamp(500px,42vw,650px); margin-top:clamp(30px,4vw,58px); overflow:hidden; border:1px solid rgba(255,255,255,.14); border-radius:3px; background:#05080a; }
.designic-world-panel { position:relative; isolation:isolate; flex:1 1 25%; min-width:0; overflow:hidden; color:#fff; border-right:1px solid rgba(255,255,255,.16); text-decoration:none; transition:flex .72s cubic-bezier(.2,.75,.2,1); }
.designic-world-panel:last-child { border-right:0; }
.designic-world-image,.designic-world-shade { position:absolute; inset:0; }
.designic-world-image { z-index:-2; background-color:#0b1115; background-image:var(--designic-world-image); background-position:center; background-size:cover; transform:scale(1.035); filter:saturate(.74) brightness(.58); transition:transform .85s cubic-bezier(.2,.75,.2,1),filter .55s ease; }
.designic-world-shade { z-index:-1; background:linear-gradient(180deg,rgba(3,6,8,.2) 0%,rgba(3,6,8,.1) 36%,rgba(3,6,8,.94) 100%); transition:background .5s ease; }
.designic-world-index { position:absolute; top:24px; left:24px; color:var(--designic-accent); font-size:10px; font-weight:800; letter-spacing:.18em; }
.designic-world-icon { position:absolute; top:22px; right:22px; display:grid; place-items:center; width:34px; height:34px; color:rgba(255,255,255,.82); }
.designic-world-icon svg { width:23px; height:23px; }
.designic-world-copy { position:absolute; right:25px; bottom:28px; left:25px; display:flex; flex-direction:column; align-items:flex-start; }
.designic-world-copy strong { max-width:260px; color:#fff; font-size:clamp(27px,2.25vw,38px); font-weight:520; letter-spacing:-.045em; line-height:.95; }
.designic-world-copy small { max-width:390px; max-height:0; margin-top:0; overflow:hidden; color:rgba(255,255,255,.72); font-size:13px; line-height:1.6; opacity:0; transform:translateY(10px); transition:max-height .55s ease,margin .45s ease,opacity .35s ease,transform .45s ease; }
.designic-world-copy b { display:inline-flex; align-items:center; gap:10px; max-height:0; margin-top:0; overflow:hidden; color:#fff; font-size:10px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; opacity:0; transition:max-height .45s ease,margin .45s ease,opacity .35s ease; }
.designic-world-copy b i { color:var(--designic-accent); font-size:15px; font-style:normal; }
.designic-worlds:hover .designic-world-panel { flex-grow:.72; }
.designic-worlds .designic-world-panel:hover,.designic-worlds .designic-world-panel:focus-visible,.designic-worlds .designic-world-panel:focus-within { flex-grow:1.85; outline:0; }
.designic-world-panel:hover .designic-world-image,.designic-world-panel:focus-visible .designic-world-image,.designic-world-panel:focus-within .designic-world-image { transform:scale(1); filter:saturate(1) brightness(.82); }
.designic-world-panel:hover .designic-world-shade,.designic-world-panel:focus-visible .designic-world-shade,.designic-world-panel:focus-within .designic-world-shade { background:linear-gradient(180deg,rgba(3,6,8,.08),rgba(3,6,8,.03) 36%,rgba(3,6,8,.9) 100%); }
.designic-world-panel:hover .designic-world-copy small,.designic-world-panel:focus-visible .designic-world-copy small,.designic-world-panel:focus-within .designic-world-copy small { max-height:90px; margin-top:14px; opacity:1; transform:none; }
.designic-world-panel:hover .designic-world-copy b,.designic-world-panel:focus-visible .designic-world-copy b,.designic-world-panel:focus-within .designic-world-copy b { max-height:30px; margin-top:17px; opacity:1; }

/* Current project as a full-width cinematic intermission. */
body.designic-home .designic-current-focus { padding-top: 0; }
body.designic-home .designic-current-focus > .designic-section-inner { padding-top: clamp(90px, 9vw, 135px); }
body.designic-home .designic-focus-wrap { width: 100%; max-width: none; }
body.designic-home .designic-focus-media { min-height: min(78vw, 920px); border-radius: 0; }
body.designic-home .designic-focus-copy { max-width: 700px; }
body.designic-home .designic-focus-copy h3 { font-size: clamp(64px, 10vw, 150px); line-height: .8; letter-spacing: -.07em; }

/* Editorial Identity Stage — a portrait-free, typographic About section. */
body.designic-home .designic-about { position:relative; isolation:isolate; overflow:hidden; padding-top:clamp(62px,6vw,90px)!important; padding-bottom:clamp(72px,7vw,105px); background:#0a0f13; }
body.designic-home .designic-about:before { content:""; position:absolute; z-index:-2; inset:0; background-image:linear-gradient(rgba(255,255,255,.032) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.032) 1px,transparent 1px); background-size:72px 72px; -webkit-mask-image:linear-gradient(180deg,transparent,black 18%,black 84%,transparent); mask-image:linear-gradient(180deg,transparent,black 18%,black 84%,transparent); }
body.designic-home .designic-about .designic-section-heading { position:relative; z-index:2; margin-bottom:clamp(42px,5vw,68px)!important; }
body.designic-home .designic-about .designic-section-heading h2 { font-size:clamp(28px,3vw,44px); }
.designic-about-kinetic { position:absolute; z-index:-1; top:42%; left:0; width:100%; overflow:hidden; color:rgba(255,255,255,.02); font-size:clamp(90px,10vw,165px); font-weight:750; letter-spacing:-.065em; line-height:.8; white-space:nowrap; pointer-events:none; transform:translateY(-50%); }
.designic-about-kinetic span { display:inline-block; animation:designicIdentityDrift 42s linear infinite; }
@keyframes designicIdentityDrift { to { transform:translateX(-48%); } }
.designic-identity-stage { position:relative; z-index:1; }
.designic-identity-statement { display:flex; flex-direction:column; align-items:flex-start; max-width:880px; margin:0; color:#f5f3ee; font-size:clamp(38px,4vw,68px); font-weight:540; letter-spacing:-.045em; line-height:.94; }
.designic-identity-statement span { display:block; }
.designic-identity-statement .is-accent { color:var(--designic-accent); margin-left:clamp(0px,3vw,42px); }
.designic-identity-intro { display:grid; grid-template-columns:minmax(280px,1fr) minmax(260px,.72fr); column-gap:clamp(45px,9vw,140px); align-items:end; margin-top:clamp(45px,5vw,72px); padding-top:24px; border-top:1px solid rgba(255,255,255,.19); }
.designic-identity-intro p { grid-row:span 3; max-width:680px; margin:0; color:rgba(255,255,255,.68); font-size:clamp(14px,1.15vw,17px); line-height:1.7; }
.designic-identity-intro > strong { color:#fff; font-size:15px; font-weight:700; letter-spacing:.06em; }
.designic-identity-intro > small { margin-top:8px; color:rgba(255,255,255,.45); font-size:9px; font-weight:750; letter-spacing:.16em; line-height:1.6; }
.designic-identity-intro .designic-outline-button { width:max-content; margin-top:22px; }
.designic-identity-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:clamp(38px,4.5vw,62px); border-top:1px solid rgba(255,255,255,.19); border-bottom:1px solid rgba(255,255,255,.19); }
.designic-identity-facts > div { min-width:0; padding:25px 22px 27px 0; border-right:1px solid rgba(255,255,255,.14); }
.designic-identity-facts > div:not(:first-child) { padding-left:22px; }
.designic-identity-facts > div:last-child { border-right:0; }
.designic-identity-facts span,.designic-identity-facts strong { display:block; }
.designic-identity-facts span { margin-bottom:11px; color:var(--designic-accent); font-size:9px; font-weight:800; letter-spacing:.17em; }
.designic-identity-facts strong { overflow-wrap:anywhere; color:#f5f3ee; font-size:clamp(16px,1.4vw,21px); font-weight:520; letter-spacing:-.025em; }

/* Compact, calm closing panel — accent color is used sparingly. */
body.designic-home .designic-contact { position:relative; margin-top:0; padding:clamp(68px,7vw,100px) 0; overflow:hidden; border-top:3px solid var(--designic-accent); background:#0d1114; color:#f5f3ee; }
body.designic-home .designic-contact:before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 82% 18%,color-mix(in srgb,var(--designic-accent) 8%,transparent),transparent 34%); }
body.designic-home .designic-contact .designic-section-inner { position:relative; }
body.designic-home .designic-contact .designic-section-heading { margin-bottom:clamp(35px,4vw,55px); border-color:rgba(255,255,255,.17); }
body.designic-home .designic-contact .designic-section-heading h2 { color:#f5f3ee; font-size:clamp(28px,3vw,44px); }
body.designic-home .designic-contact .designic-section-heading span { color:var(--designic-accent); }
body.designic-home .designic-contact-grid { grid-template-columns:minmax(300px,1.05fr) minmax(250px,.72fr) minmax(220px,.52fr); gap:clamp(32px,5vw,75px); align-items:start; padding-top:0; }
body.designic-home .designic-contact-grid > h3 { grid-row:auto; max-width:650px; color:#f5f3ee; font-size:clamp(40px,4.5vw,68px); line-height:.94; letter-spacing:-.05em; }
body.designic-home .designic-contact-intro > p { color:rgba(255,255,255,.62); font-size:14px; line-height:1.75; }
body.designic-home .designic-contact-details { border-color:rgba(255,255,255,.15); }
body.designic-home .designic-contact-details span { color:rgba(255,255,255,.42); }
body.designic-home .designic-contact a,
body.designic-home .designic-contact b { color:#f5f3ee; }
body.designic-home .designic-contact .designic-outline-button { color:#f5f3ee; border-color:rgba(255,255,255,.42); background:transparent; }
body.designic-home .designic-contact .designic-outline-button:hover { color:#fff; border-color:var(--designic-accent); background:var(--designic-accent); }
body.designic-home .designic-socials a { border-radius:3px; border-color:rgba(255,255,255,.18); }

@media (max-width: 1100px) {
    .designic-worlds { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); min-height:0; }
    .designic-world-panel { min-height:430px; border-right:1px solid rgba(255,255,255,.16); border-bottom:1px solid rgba(255,255,255,.16); }
    .designic-world-panel:nth-child(2n) { border-right:0; }
    .designic-world-panel:nth-last-child(-n+2) { border-bottom:0; }
    .designic-world-copy small { max-height:90px; margin-top:12px; opacity:1; transform:none; }
    .designic-world-copy b { max-height:30px; margin-top:15px; opacity:1; }
    body.designic-home .designic-hero { background-size: cover; }
    body.designic-home .designic-hero::before { background: linear-gradient(90deg, rgba(5,9,11,.96), rgba(5,9,11,.35)); }
    body.designic-home .designic-hero-inner { grid-template-columns: 1fr; }
    body.designic-home .designic-hero-note { display: none; }
    .designic-identity-intro { grid-template-columns:1fr; row-gap:24px; }
    .designic-identity-intro p { grid-row:auto; }
    .designic-identity-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .designic-identity-facts > div:nth-child(2) { border-right:0; }
    .designic-identity-facts > div:nth-child(-n+2) { border-bottom:1px solid rgba(255,255,255,.14); }
    body.designic-home .designic-contact-grid { grid-template-columns:1fr 1fr; }
    body.designic-home .designic-contact-details { grid-column:2; padding-top:0; border-top:0; border-left:1px solid rgba(255,255,255,.15); }
}

@media (max-width: 680px) {
    .designic-worlds { grid-template-columns:1fr; }
    .designic-world-panel { min-height:390px; border-right:0; border-bottom:1px solid rgba(255,255,255,.16); }
    .designic-world-panel:nth-last-child(2) { border-bottom:1px solid rgba(255,255,255,.16); }
    .designic-world-panel:last-child { border-bottom:0; }
    body.designic-home .designic-hero { background-position: center; }
    body.designic-home .designic-hero::before { background: linear-gradient(0deg, rgba(5,9,11,.96) 0%, rgba(5,9,11,.3) 75%); }
    body.designic-home .designic-hero-inner { align-items: end; padding-bottom: 95px; }
    body.designic-home .designic-hero h1 { font-size: clamp(54px, 19vw, 90px); }
    body.designic-home .designic-hero::after { bottom: 28px; }
    body.designic-home .designic-about { padding-top:54px!important; }
    .designic-identity-statement { font-size:clamp(32px,9vw,44px); line-height:.96; }
    .designic-identity-statement .is-accent { margin-left:0; }
    .designic-about-kinetic { top:36%; font-size:170px; }
    .designic-identity-facts { grid-template-columns:1fr; }
    .designic-identity-facts > div,.designic-identity-facts > div:not(:first-child) { padding:19px 0; border-right:0; border-bottom:1px solid rgba(255,255,255,.14); }
    .designic-identity-facts > div:last-child { border-bottom:0; }
    body.designic-home .designic-contact { padding:58px 0; }
    body.designic-home .designic-contact-grid { grid-template-columns:1fr; }
    body.designic-home .designic-contact-grid > h3 { font-size:clamp(36px,11vw,50px); }
    body.designic-home .designic-contact-details { grid-column:auto; padding:24px 0 0; border-top:1px solid rgba(255,255,255,.15); border-left:0; }
    body.designic-home .designic-contact-grid { grid-template-columns: 1fr; }
    body.designic-home .designic-contact-grid > h3 { grid-row: auto; }
}
