/*
Theme Name: Exocubic Consulting
Description: Editorial block theme for the Exocubic consultancy and Thinking Outside the Box.
Version: 1.0.0
Requires at least: 6.6
Text Domain: exocubic-consulting
*/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500&family=Instrument+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{--ink:#24282b;--paper:#f7f5f0;--soft:#ede9e0;--slate:#485258;--teal:#245b58;--bronze:#e1af89;--rule:#d2cdc2;--display:"Instrument Serif",Georgia,serif;--mono:"IBM Plex Mono",monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.55 "Instrument Sans",system-ui,sans-serif}
a{color:inherit;text-underline-offset:.24em}
a:hover{text-decoration-thickness:2px}
a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
img{display:block;max-width:100%;height:auto}
.wrap{width:min(1200px,calc(100% - 96px));margin-inline:auto}
.skip{position:absolute;left:16px;top:12px;transform:translateY(-150%);background:var(--paper);padding:8px;z-index:1}
.skip:focus{transform:none}
.nav,.foot{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:22px}
nav{display:flex;gap:clamp(14px,3vw,43px);font-size:15px}
nav a,.button,.foot a{text-decoration:none}
nav a:hover,.foot a:hover,.lightlink:hover{text-decoration:underline}
.button{display:inline-flex;gap:14px;align-items:center;justify-content:center;padding:11px 16px;border:1px solid transparent;font-weight:700;font-size:14px;line-height:1.3}
.outline{border-color:var(--ink)}
.outline:hover{background:var(--ink);color:var(--paper)}
.copper{background:var(--bronze);color:#24282b}
.copper:hover{background:#f0c8a9}
.hero,.contact{background:var(--ink);color:var(--paper)}
.hero-grid,.split{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(30px,7vw,108px);align-items:center}
.hero-grid{padding-block:clamp(58px,8vw,114px)}
.label{margin:0 0 13px;font:500 .73rem/1.45 var(--mono);text-transform:uppercase;letter-spacing:.13em;color:var(--teal)}
.hero .label,.contact .label{color:var(--bronze)}
h1,h2,h3,p,figure,dl,dd{margin:0}
h1,h2{font-family:var(--display);font-weight:400;letter-spacing:-.035em}
h1{font-size:clamp(62px,8.6vw,129px);line-height:.88}
h1 em{color:var(--bronze)}
h2{font-size:clamp(40px,5vw,72px);line-height:.96}
h3{font-size:clamp(21px,2.2vw,30px);line-height:1.15;font-weight:600;letter-spacing:-.025em}
.lede{max-width:36ch;margin-top:26px;color:#e0dcd3;font-size:clamp(17px,1.7vw,21px)}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 23px;margin-top:29px}
.lightlink,.textlink{font-size:14px;font-weight:700}
.textlink{color:var(--teal)}
.diagram{min-width:0;border:1px solid #73726a;background:#282d30}
.diagram-head,figcaption{padding:12px 16px;font:500 10px/1.4 var(--mono);letter-spacing:.08em;color:#e1d7cb}
.diagram-head{display:flex;justify-content:space-between;gap:8px;border-bottom:1px solid #73726a}
figcaption{border-top:1px solid #73726a}
.schematic{height:320px;position:relative;display:grid;grid-template-rows:repeat(3,1fr);justify-items:center;align-items:center;padding:16px 30px 16px 0;background-image:linear-gradient(#ffffff13 1px,transparent 1px),linear-gradient(90deg,#ffffff13 1px,transparent 1px);background-size:22px 22px}
.schematic:before{content:"";position:absolute;top:54px;bottom:54px;left:calc(50% - 15px);border-left:1px solid var(--bronze)}
.node{z-index:1;width:56%;padding:12px 5px;border:1px solid #a19b90;text-align:center;background:#282d30;font-size:15px;font-weight:600}
.node small{display:block;font-weight:400;font-size:12px}
.middle{border-color:var(--bronze);background:#393531;color:#ffe0c7}
.loop{position:absolute;left:66%;right:11%;top:20%;bottom:20%;border:1px dashed #a49b90;border-left:none}
.port{position:absolute;left:calc(50% - 18px);width:7px;height:7px;background:var(--bronze);transform:rotate(45deg)}
.p1{top:33%}.p2{bottom:33%}
.section{padding-block:clamp(49px,7vw,94px)}
.three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:35px}
.three article{padding:23px 21px;border:1px solid var(--rule)}
.services article{border-top:3px solid #a96239}
.three article p,.split h2+p,.split p+a{margin-top:14px}
.three article .label{margin:0 0 12px}
.three ul{padding-left:18px;color:var(--slate);margin-bottom:0;font-size:15px}
.three li+li{margin-top:6px}
.band{background:var(--soft);border-block:1px solid var(--rule)}
.credentials{border-top:1px solid var(--rule)}
.credentials div{padding:13px 0;border-bottom:1px solid var(--rule)}
dt{font-weight:700}
dd{color:var(--slate)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:16px;flex-wrap:wrap}
.articles{grid-template-columns:repeat(2,minmax(0,1fr))}
.foot{font-size:14px;color:var(--slate)}
@media(max-width:850px){.wrap{width:calc(100% - 48px)}.hero-grid,.split{gap:32px}.three{gap:12px}.three article{padding:17px}.nav img{width:145px}.schematic{height:260px}}
@media(max-width:690px){.wrap{width:calc(100% - 36px)}.nav{display:grid;grid-template-columns:1fr auto;gap:14px;padding-block:16px}.nav nav{grid-row:2;grid-column:1/-1;border-top:1px solid var(--rule);padding-top:12px;flex-wrap:wrap}.hero-grid,.split,.three{grid-template-columns:1fr}.hero-grid{padding-block:48px}.diagram{max-width:480px}.schematic{height:245px}.foot{flex-wrap:wrap;gap:12px}.foot p{order:1;width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
nav a[aria-current="page"]{text-decoration:underline}
.craft-overview{border-bottom:1px solid var(--rule)}
.craft-hero .lede{max-width:42ch}
.values{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;list-style:none;margin:34px 0 0;padding:0;border-block:1px solid var(--rule)}
.values li{padding:16px 12px;font-weight:600}
.values li+li{border-left:1px solid var(--rule)}
.values strong{display:block;color:var(--teal);font-family:var(--display);font-size:39px;font-weight:400;line-height:1}
.value-details{margin-top:32px;border-top:1px solid var(--rule)}
.value-details div{display:grid;grid-template-columns:minmax(150px,1fr) 3fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--rule)}
.topics{flex-wrap:wrap;gap:10px;margin-top:22px}
.topics a{padding:6px 12px;border:1px solid var(--rule);color:var(--teal);font-weight:700}
.topics+.articles{margin-top:18px}
.book-feature{display:grid;grid-template-columns:minmax(175px,260px) 1fr;gap:clamp(26px,6vw,88px);align-items:center}
.book-art{width:min(100%,230px);aspect-ratio:3/4;display:flex;flex-direction:column;justify-content:center;background:var(--ink);color:var(--paper);border-left:7px solid var(--teal);padding:18px;box-shadow:8px 8px 0 #d2cdc2;font:500 clamp(12px,1.6vw,20px)/1.25 var(--mono)}
.book-art small{font-size:.62em;letter-spacing:.07em}
.book-rule{width:45%;border-top:1px solid var(--bronze);margin:13px 0}
.book-subtitle{font-size:21px;margin:9px 0 14px}
.book-feature p+p{margin-top:12px}
.book-next{border-top:1px solid var(--rule);padding-top:13px}
@media(max-width:900px){.nav nav{gap:14px}}
@media(max-width:690px){.values{grid-template-columns:repeat(2,minmax(0,1fr));border-bottom:0}.values li,.values li+li{border-left:0;border-bottom:1px solid var(--rule)}.value-details div,.book-feature{grid-template-columns:1fr}.value-details div{gap:3px}.book-art{width:155px}}

.wp-site-blocks > * { margin-block-start: 0; }
.exo-site-header { padding: 20px clamp(18px, 5vw, 72px); border-bottom: 1px solid var(--rule); }
.exo-site-footer { padding: 24px clamp(18px, 5vw, 72px); border-top: 1px solid var(--rule); }
.exo-reading { padding: clamp(28px, 6vw, 90px) max(20px, 5vw); }
.exo-reading h1 { font-size: clamp(42px, 6vw, 82px); }
.exo-reading h2 { font-size: clamp(28px, 4vw, 48px); }
.exo-reading .wp-block-post-template > li { padding-block: 28px; border-bottom: 1px solid var(--rule); }
.exo-reading .wp-block-post-content img { height: auto; }
.exo-consulting .wp-block-post-content > * { margin-block-start: 0; }
.exo-consulting .wp-block-post-content h1 { font-style: normal; }
.exo-consulting .wp-block-post-content h2 { margin-bottom: .35em; }
.exo-consulting .wp-block-post-content p { margin-block: .65em; }
.exo-consulting .wp-block-post-content a:not(.wp-element-button) { text-decoration: underline; }
.exo-consulting .wp-block-post-content .wp-block-columns { gap: clamp(18px, 5vw, 72px); }
.exo-consulting .wp-block-post-content .wp-block-button__link { border-radius: 0; }
