/*
Theme Name: Just Design Ine
Author: Just Design Ine
Description: An independent brand and WordPress design studio theme, with editable portfolio patterns and project enquiries.
Version: 1.4.0
Requires at least: 6.6
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: just-design-ine
*/
@font-face{font-family:Inter;src:url('assets/fonts/Inter24pt-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('assets/fonts/Inter24pt-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--punch-red:#e63946ff;--honeydew:#f1faeeff;--frosted-blue:#a8dadcff;--cerulean:#457b9dff;--oxford-navy:#1d3557ff;--jdi-paper:var(--wp--preset--color--paper,var(--honeydew));--jdi-ink:var(--wp--preset--color--ink,var(--oxford-navy));--jdi-accent:var(--wp--preset--color--accent,var(--punch-red));--jdi-blue:var(--wp--preset--color--rose,var(--frosted-blue));--jdi-line:rgba(29,53,87,.23)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:2rem}body{margin:0}img{max-width:100%;height:auto}a{text-underline-offset:4px}a:hover{text-decoration-thickness:2px}button,input,textarea,select{font:inherit} :focus-visible{outline:3px solid #457b9d;outline-offset:5px}::selection{background:var(--jdi-blue);color:var(--jdi-ink)}
.wp-site-blocks>*{margin-block-start:0}.jdi-main{margin-top:0}.jdi-section{padding:clamp(64px,8vw,112px) max(6vw,calc((100vw - 1240px)/2));margin:0!important}.jdi-section h2{font-size:clamp(2.7rem,5.7vw,5.4rem);max-width:1000px;margin:18px 0 36px}.jdi-section h3{font-size:clamp(1.7rem,2.5vw,2.4rem);margin:16px 0}.jdi-section p{max-width:680px}.jdi-section em{font-weight:400}.jdi-eyebrow,.jdi-micro{font-size:.68rem;letter-spacing:.14em;font-weight:600;line-height:1.6}.jdi-eyebrow{margin-top:0}.jdi-lead{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.65}.jdi-section-note{color:var(--jdi-ink);margin-bottom:36px}.jdi-header{border-bottom:1px solid var(--jdi-line)}.jdi-header-inner,.jdi-footer-inner{max-width:1440px;margin:auto;padding:26px 6vw;display:flex;align-items:center;justify-content:space-between;gap:32px}.jdi-wordmark{font-weight:600;letter-spacing:-.07em;font-size:1.65rem;margin:0}.jdi-wordmark a{text-decoration:none}.jdi-wordmark-dot{color:#e63946}.jdi-header .wp-block-navigation{font-size:.82rem;font-weight:600}.jdi-header .wp-block-navigation__container{gap:32px}.jdi-header .wp-block-navigation-item:last-child a{border-bottom:1px solid;padding-bottom:4px}
.jdi-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:7%;align-items:center;padding-top:70px;padding-bottom:80px}.jdi-hero h1,.jdi-hero-alt h1{font-size:clamp(4rem,7.7vw,7.8rem);line-height:.98;letter-spacing:-.065em;margin:30px 0}.jdi-hero-copy .jdi-lead{max-width:510px;margin-bottom:30px}.jdi-hero .jdi-micro{margin-top:35px;font-size:.6rem}.wp-block-buttons{gap:12px;flex-wrap:wrap;display:flex}.wp-block-button__link{border:1px solid var(--jdi-ink);transition:background .2s,color .2s;display:inline-block;text-decoration:none}.wp-block-button__link:hover{background:var(--jdi-blue);color:var(--jdi-ink)}.wp-block-button.is-style-outline .wp-block-button__link{border:1px solid currentColor;background:transparent;color:inherit;padding:1rem 1.5rem}.wp-block-button.is-style-outline .wp-block-button__link:hover{background:var(--jdi-ink);color:var(--jdi-paper)}
.jdi-hero-art{background:var(--jdi-blue);min-height:520px;padding:34px;position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;transform:rotate(3deg);box-shadow:12px 14px 0 #1d3557}.jdi-hero-art p{margin:0}.jdi-art-label,.jdi-art-bottom{font-size:.62rem;letter-spacing:.18em;font-weight:600}.jdi-art-type{font-family:Georgia,serif;font-size:clamp(5rem,7.3vw,7.3rem);letter-spacing:-.075em;line-height:.85}.jdi-star{color:var(--jdi-accent);position:absolute;right:28px;bottom:88px;font-size:7rem;line-height:1}.jdi-hero-art .jdi-art-bottom{border-top:1px solid var(--jdi-ink);padding-top:16px}.jdi-intro-copy{max-width:720px;margin-left:0;margin-right:auto}.jdi-services{display:grid;grid-template-columns:1fr 1fr;gap:50px;margin-top:55px}.jdi-services>div{border-top:1px solid var(--jdi-line);padding-top:24px}.jdi-project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.jdi-project figure,.jdi-logo figure{margin:0;overflow:hidden}.jdi-project img{width:100%;display:block;transition:transform .3s}.jdi-project:hover img{transform:scale(1.025)}.jdi-project h3{margin:8px 0}.jdi-project p{margin:8px 0;font-size:.85rem}.jdi-project .jdi-micro{font-size:.58rem;margin-top:22px}.jdi-logo-section{border-top:1px solid var(--jdi-line)}.jdi-logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.jdi-logo img{display:block;width:100%}.jdi-logo .jdi-micro{font-size:.58rem}.jdi-dark{background:var(--jdi-ink);color:var(--jdi-paper)}.jdi-dark a{color:inherit}.jdi-dark .wp-block-button__link{background:var(--jdi-blue);color:var(--jdi-ink)}.jdi-dark .is-style-outline .wp-block-button__link{background:transparent;color:var(--jdi-paper)}.jdi-dark .is-style-outline .wp-block-button__link:hover{background:var(--jdi-paper);color:var(--jdi-ink)}.jdi-process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;margin-top:56px}.jdi-step{border-top:1px solid #457b9d;padding-top:25px}.jdi-step-number{font-size:.75rem;color:var(--jdi-blue)}.jdi-step p:last-child{color:#f1faee}.jdi-faq{max-width:860px;margin-left:auto}.jdi-faq details{padding:25px 0;border-bottom:1px solid var(--jdi-line)}.jdi-faq summary{font-weight:600;cursor:pointer;padding-right:18px}.jdi-faq details p{color:var(--jdi-ink)}.jdi-contact{background:var(--jdi-blue)}.jdi-contact h2{max-width:900px}.jdi-form{max-width:850px;margin-top:40px}.jdi-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.jdi-form label{font-size:.82rem;font-weight:600;display:block;margin-bottom:22px}.jdi-form input,.jdi-form textarea,.jdi-form select{display:block;width:100%;border:1px solid #457b9d;border-radius:0;padding:13px;margin-top:8px;color:var(--jdi-ink);background:#f1faee}.jdi-form textarea{resize:vertical;min-height:150px}.jdi-form button{padding:16px 26px;background:var(--jdi-ink);color:var(--jdi-paper);border:1px solid var(--jdi-ink);cursor:pointer}.jdi-form button:hover{background:var(--jdi-paper);color:var(--jdi-ink)}.jdi-form-note{font-size:.8rem}.jdi-notice{border:1px solid currentColor;padding:18px}.jdi-honeypot{position:absolute;left:-9999px}.jdi-footer-inner{padding-top:45px;padding-bottom:45px;align-items:flex-start}.jdi-footer p{font-size:.85rem}.jdi-footer .jdi-wordmark{font-size:1.65rem}.jdi-reading{max-width:900px;margin:0 auto;padding:80px 28px;min-height:60vh}.jdi-reading h1{font-size:clamp(3rem,6vw,5rem)}.jdi-reading .wp-block-post-template{list-style:none;padding:0}.jdi-reading .wp-block-post-template>li{padding:30px 0;border-bottom:1px solid var(--jdi-line)}.jdi-post-navigation,.wp-block-query-pagination{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;margin-top:35px}.jdi-hero-alt{padding-block:110px}.jdi-hero-alt .jdi-lead{max-width:650px}.jdi-skip-link{position:fixed;top:-100px;left:16px;padding:12px 20px;background:var(--jdi-ink);color:white;z-index:100000}.jdi-skip-link:focus{top:16px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Red accents frame the studio identity; body copy keeps strong contrast. */
.jdi-header{border-top:4px solid var(--jdi-accent)}.jdi-hero h1 em,.jdi-hero-alt h1 em{border-bottom:3px solid var(--jdi-accent)}

/* Layout owns spacing here, rather than WordPress's flow-block sibling margins. */
.jdi-header-inner > *, .jdi-footer-inner > *,
.jdi-hero > *, .jdi-services > *, .jdi-project-grid > *,
.jdi-logo-grid > *, .jdi-process-grid > * {
    margin-block-start: 0 !important;
    margin-block-end: 0;
    min-width: 0;
}
.jdi-header-inner, .jdi-hero, .jdi-services, .jdi-project-grid,
.jdi-logo-grid, .jdi-process-grid, .jdi-form-grid { min-width: 0; }
.jdi-section, .jdi-reading { overflow-wrap: anywhere; }
.jdi-intro-copy { margin-inline-start: 0 !important; text-align: left; }
.jdi-header .wp-block-navigation { margin-inline-start: auto; }
.jdi-header .wp-block-navigation a { display: inline-flex; align-items: center; min-height: 44px; }
.jdi-wordmark { flex-shrink: 0; }
.jdi-project { display: flex; flex-direction: column; gap: 8px; }
.jdi-project > * { margin: 0 !important; }
.jdi-project > .jdi-micro { padding-top: 14px; }
.jdi-project figure, .jdi-logo figure { width: 100%; aspect-ratio: 4 / 3; }
.jdi-project img, .jdi-logo img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.jdi-project h3 { line-height: 1.15; }
.jdi-project > p:last-child { margin-top: auto !important; }
@supports (grid-template-rows: subgrid) {
    .jdi-project { display: grid; grid-template-rows: subgrid; grid-row: span 4; row-gap: 8px; }
    .jdi-project > p:last-child { margin-top: 0 !important; }
}
.jdi-menu-toggle, .jdi-dialog-close, .jdi-contact-open {
    border: 1px solid var(--jdi-ink);
    background: var(--jdi-ink);
    color: var(--jdi-paper);
    min-height: 48px;
    padding: 12px 20px;
    font: 600 .9rem/1.5 Inter, Arial, sans-serif;
    cursor: pointer;
    border-radius: 0;
}
.jdi-menu-toggle { display: none; white-space: nowrap; }
.jdi-contact-open { margin-top: 24px; max-width: 100%; }
.jdi-contact-open[hidden] { display: none; }
.jdi-contact-open:hover, .jdi-dialog-close:hover, .jdi-menu-toggle:hover {
    background: var(--jdi-blue); color: var(--jdi-ink);
}
.jdi-modal-ready .jdi-contact-fallback { display: none; }
html.jdi-dialog-open { overflow: hidden; }
.jdi-dialog-open body { position: fixed; top: var(--jdi-scroll-offset); left: 0; right: 0; width: 100%; }
.jdi-dialog {
    box-sizing: border-box;
    width: min(760px, calc(100% - 32px));
    max-width: none;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 0;
    border: 1px solid var(--jdi-ink);
    background: var(--jdi-paper);
    color: var(--jdi-ink);
    overflow: auto;
    overscroll-behavior: contain;
    box-shadow: 0 24px 100px rgb(29 53 87 / 25%);
    font: 400 1rem/1.65 Inter, Arial, sans-serif;
}
.jdi-dialog:not([open]) { display: none; }
.jdi-dialog::backdrop { background: rgb(29 53 87 / 72%); }
.jdi-dialog-bar {
    position: sticky; top: 0; z-index: 2;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 20px 28px;
    background: var(--jdi-paper);
    border-bottom: 1px solid var(--jdi-line);
}
.jdi-dialog-bar .jdi-eyebrow { margin: 0; }
.jdi-dialog-close { flex-shrink: 0; }
.jdi-dialog-content { padding: 28px; overflow-wrap: anywhere; }
.jdi-dialog-content h2 { font: 400 clamp(2rem, 5vw, 3.3rem)/1.08 Georgia, serif; letter-spacing: -.045em; margin: 0 0 20px; }
.jdi-dialog-content > p { margin: 0 0 24px; }
.jdi-dialog .jdi-form { margin-top: 24px; }
.jdi-dialog .jdi-form input, .jdi-dialog .jdi-form textarea, .jdi-dialog .jdi-form select { font-size: 16px; }
.jdi-dialog .jdi-form-grid { gap: 20px; }
.jdi-dialog .jdi-notice { margin-top: 20px; }
.jdi-menu-dialog { width: min(540px, calc(100% - 24px)); }
.jdi-menu-links { display: flex; flex-direction: column; padding: 12px 28px 20px; }
.jdi-menu-link {
    display: block; padding: 18px 0; min-height: 56px;
    border-bottom: 1px solid var(--jdi-line);
    font: 400 clamp(1.7rem, 5vw, 2.5rem)/1.25 Georgia, serif;
    text-decoration: none; color: var(--jdi-ink); overflow-wrap: anywhere;
}
.jdi-menu-link:hover { color: var(--cerulean); }
.jdi-menu-caption { margin: 0; padding: 12px 28px 28px; font-size: .8rem; }

@media (min-width: 1600px) { .jdi-hero { gap: 90px; } }
@media (max-width: 1100px) {
    .jdi-hero { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 40px; }
    .jdi-hero-art { min-height: 440px; padding: 24px; }
    .jdi-art-type { font-size: clamp(4rem, 7.3vw, 6rem); }
    .jdi-star { font-size: 5rem; right: 20px; }
    .jdi-project-grid { gap: 24px; }
    .jdi-services, .jdi-process-grid { gap: 28px; }
}
@media (max-width: 899px) {
    .jdi-header-inner { padding: 18px 5vw; gap: 16px; flex-wrap: wrap; }
    .jdi-header .wp-block-navigation { flex-basis: 100%; margin: 0; }
    .jdi-header .wp-block-navigation__container { flex-wrap: wrap; gap: 12px 24px; }
    .jdi-nav-ready .jdi-header-inner { flex-wrap: nowrap; }
    .jdi-nav-ready .jdi-header .wp-block-navigation { display: none; }
    .jdi-nav-ready .jdi-menu-toggle { display: inline-flex; align-items: center; justify-content: center; margin-left: auto; }
    .jdi-hero { grid-template-columns: minmax(0, 1fr); gap: 44px; padding-top: 48px; }
    .jdi-hero-copy .jdi-lead { max-width: 640px; }
    .jdi-hero-art { width: calc(100% - 24px); max-width: 520px; min-height: 440px; margin: 12px !important; }
    .jdi-art-type { font-size: clamp(3.3rem, 13vw, 6rem); }
    .jdi-hero h1 { font-size: clamp(3rem, 9vw, 5.6rem); }
    .jdi-project-grid, .jdi-logo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .jdi-process-grid { grid-template-columns: minmax(0, 1fr); }
    .jdi-step { padding-top: 20px; }
    .jdi-step h3 { margin-block: 12px; }
    .jdi-step p:last-child { margin-bottom: 0; }
}
@media (max-width: 599px) {
    .jdi-section { padding: 56px 6vw; }
    .jdi-section h2 { font-size: clamp(2rem, 9vw, 2.8rem); }
    .jdi-section h3 { font-size: 1.8rem; }
    .jdi-wordmark { font-size: clamp(1.1rem, 5vw, 1.4rem); }
    .jdi-menu-toggle { padding-inline: 14px; }
    .jdi-hero h1, .jdi-hero-alt h1 { font-size: clamp(2.7rem, 12vw, 4.2rem); }
    .jdi-hero-art { min-height: 370px; padding: 22px; transform: rotate(2deg); box-shadow: 8px 10px 0 var(--jdi-ink); }
    .jdi-art-type { font-size: clamp(3rem, 14vw, 5.5rem); }
    .jdi-art-label, .jdi-art-bottom { letter-spacing: .1em; }
    .jdi-star { font-size: 4.5rem; right: 20px; bottom: 70px; }
    .jdi-services, .jdi-project-grid, .jdi-form-grid { grid-template-columns: minmax(0, 1fr); }
    .jdi-services { gap: 28px; }
    .jdi-logo-grid { gap: 16px; }
    .jdi-footer-inner { flex-direction: column; gap: 20px; }
    .jdi-dialog { width: calc(100% - 16px); max-height: calc(100vh - 16px); max-height: calc(100dvh - 16px); }
    .jdi-dialog-bar { padding: 14px 16px; gap: 12px; }
    .jdi-dialog-bar .jdi-eyebrow { font-size: .58rem; }
    .jdi-dialog-close { padding: 10px 14px; }
    .jdi-dialog-content { padding: 24px 18px; }
    .jdi-menu-links { padding: 8px 20px 20px; }
    .jdi-menu-caption { padding: 4px 20px 24px; }
    .jdi-dialog .jdi-form-grid { gap: 0; }
}
@media (max-width: 380px) {
    .jdi-logo-grid { grid-template-columns: minmax(0, 1fr); }
    .jdi-hero .wp-block-buttons > .wp-block-button { width: 100%; }
    .jdi-hero .wp-block-button__link { width: 100%; text-align: center; padding-inline: 14px; }
}