/* Homepage prototype: plaster wall, bronze and ink, real work in fresco frames. */
:root{
 --plaster:#ebe3d5;--plaster-deep:#e1d6c3;--ink:#1e221e;--muted:#4a4e47;--line:#cbc1ae;
 --accent:#8f6d3a;--link:#1e221e;--sand:#d8c4a0;--bronze:#a88550;--night:#171715;
 --gutter:max(16px,5.5%);--header-height:96px;
 --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .25 0 0 0 0 .18 1.4 0 0 0 -.55'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
 --mottle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='900' height='900'%3E%3Cfilter id='m'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.004' numOctaves='4' seed='7' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .48 0 0 0 0 .4 0 0 0 0 .3 2.2 0 0 0 -1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23m)' opacity='.16'/%3E%3C/svg%3E");
}
body{background-color:var(--plaster);background-image:var(--grain),var(--mottle);color:var(--ink)}
.p-section,.inquiry{background:transparent}
.p-section a:focus-visible,.p-section button:focus-visible,.p-footer a:focus-visible,.p-starters button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.p-footer a:focus-visible,.p-starters button:focus-visible{outline-color:var(--sand)}

/* Header: brand, centred navigation, action and future channels */
header.p-header{height:var(--header-height);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:32px}
.p-header nav{justify-self:center;gap:36px;font-size:15px}
.p-head-actions{justify-self:end;display:flex;align-items:center;gap:22px}
.p-head-cta{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid #b79860;color:#f2ede2;font-size:15px;transition:background .25s,color .25s}
.p-head-cta:hover{background:#eee6d6;color:var(--night)}
.p-social{display:flex;gap:4px;color:#d8c4a0}
.p-social span{display:grid;place-items:center;width:36px;height:36px;opacity:.75;transition:opacity .2s}
.p-social span:hover{opacity:1}
.p-social svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* Hero: same painting, more legible copy and a real action */
.p-hero .hero-bottom{display:block}
.p-hero .hero-bottom p{font-size:18px;line-height:1.6;max-width:30ch;color:#d3cdbf;margin-bottom:30px}
.p-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px}
.p-btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 28px;font-size:16px;font-weight:500;transition:background .25s,color .25s}
.p-btn-light{background:#eee6d6;color:var(--night)}.p-btn-light:hover{background:#fff}
.p-text-link{display:inline-flex;gap:8px;font-size:16px;color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;text-decoration-color:#a8855099;transition:text-decoration-color .2s}
.p-text-link:hover{text-decoration-color:currentColor}
.p-text-link-light{color:#eee6d6;text-decoration-color:#eee6d666}

/* Shared section type */
.p-section{padding:clamp(80px,10vw,150px) var(--gutter)}
.p-section h2{font-size:clamp(40px,5vw,76px);line-height:1.06;letter-spacing:-.028em;margin:0}
.p-lead{font-size:clamp(20px,1.7vw,24px);line-height:1.45;letter-spacing:-.01em;color:var(--ink)}

/* Services: an index of three directions */
.p-services-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6%;align-items:end;margin-bottom:clamp(56px,6vw,96px)}
.p-services-intro p:not(.p-lead){font-size:17px;line-height:1.7;color:var(--muted);max-width:52ch;margin-bottom:0}
.p-service-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.p-service-list li{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr);gap:4%;padding:36px 0 34px;border-bottom:1px solid var(--line);align-items:baseline}
.p-service-list h3{font-family:var(--display);font-weight:400;font-size:clamp(28px,2.7vw,40px);line-height:1.1;letter-spacing:-.02em;margin:0}
.p-service-list p{font-size:17px;line-height:1.65;margin:0;max-width:46ch}
.p-service-list .p-service-example{font-size:15px;line-height:1.6;color:var(--muted)}
.p-service-example a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:#a8855099}
.p-service-example a:hover{text-decoration-color:currentColor}

/* Projects: real screens hung like frescoes, with museum labels */
.p-projects{background:linear-gradient(180deg,#e1d6c300,#e1d6c3b3 14%,#e1d6c3b3 86%,#e1d6c300)}
.p-projects-head,.p-concepts-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6%;align-items:end;margin-bottom:clamp(56px,7vw,110px)}
.p-projects-head p,.p-concepts-head p{font-size:17px;line-height:1.7;color:var(--muted);max-width:46ch;margin:0}
.p-work-feature{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:7%;align-items:end;margin-bottom:clamp(110px,12vw,190px)}
.p-plates{position:relative;padding:0 0 9% 0}
.p-plate{position:relative;display:block;background:#12120f;box-shadow:0 40px 70px -40px #3a2c1880,0 2px 4px #2a201410;transition:transform .6s cubic-bezier(.16,1,.3,1)}
.p-plate img{display:block;width:100%;height:auto;aspect-ratio:36/25;object-fit:cover;object-position:top}
.p-plate-bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:#0f0f0d;border-bottom:1px solid #ffffff12}
.p-plate-bar i{width:7px;height:7px;border-radius:50%;background:#ffffff26}
.p-plate-bar b{flex:1;text-align:center;font-weight:400;font-size:12px;color:#bdb5a5;margin-right:33px;letter-spacing:.01em}
.p-framed::before,.p-framed::after{content:"";position:absolute;pointer-events:none;border:1px solid var(--bronze);clip-path:inset(0 100% 100% 0);transition:border-color .3s}
.p-framed::before{inset:-15px}
.p-framed::after{inset:-8px;border-color:#a8855059}
.p-framed.is-in::before{animation:p-frame-draw 1.8s cubic-bezier(.16,1,.3,1) forwards}
.p-framed.is-in::after{animation:p-frame-draw 1.8s .3s cubic-bezier(.16,1,.3,1) forwards}
@keyframes p-frame-draw{to{clip-path:inset(0)}}
a.p-plate:hover{transform:translateY(-6px)}
a.p-plate:hover::before{border-color:#8c6a35}
a.p-plate:focus-visible{outline:2px solid var(--accent);outline-offset:22px}
.p-plate-second{position:absolute;right:-7%;bottom:0;width:44%;box-shadow:0 30px 60px -24px #1f180e99}
.p-label{max-width:40ch}
.p-label-kind{font-size:15px;color:var(--muted);margin-bottom:14px}
.p-label h3{font-family:var(--display);font-weight:400;font-size:clamp(36px,3.6vw,56px);line-height:1.05;letter-spacing:-.025em;margin:0 0 20px}
.p-label p{font-size:17px;line-height:1.65}
.p-label-facts{list-style:none;margin:0 0 26px;padding:0;font-size:15px}
.p-label-facts li{padding:11px 0;border-top:1px solid var(--line)}
.p-label-facts li:last-child{border-bottom:1px solid var(--line)}
.p-label-links{display:flex;flex-wrap:wrap;gap:10px 26px;font-size:16px;margin:0}
.p-label-links a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:#a8855099}
.p-label-links a:hover{text-decoration-color:currentColor}
.p-work-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8%}
.p-work-pair .p-work:nth-child(2){margin-top:clamp(80px,9vw,160px)}
.p-work-pair .p-label{margin-top:44px}
.p-work-pair .p-label h3{font-size:clamp(30px,2.6vw,40px)}

/* Concepts: an honest, compact catalogue */
.p-concepts{padding-top:clamp(40px,6vw,90px)}
.p-concepts-head h2{font-size:clamp(36px,4.2vw,62px)}
.p-concept-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6%}
.p-concept-groups h3{font-family:var(--display);font-weight:400;font-size:clamp(26px,2.2vw,32px);letter-spacing:-.02em;margin:0 0 8px}
.p-group-note{font-size:15px;color:var(--muted);margin-bottom:22px}
.p-concept-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.p-concept-list li{border-bottom:1px solid var(--line)}
.p-concept{display:grid;grid-template-columns:132px minmax(0,1fr) 24px;gap:24px;align-items:center;width:100%;padding:20px 0;background:none;border:0;text-align:left;color:inherit}
.p-concept img{width:132px;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .5s cubic-bezier(.16,1,.3,1),filter .5s}
.p-concept-text{display:block}
.p-concept-title{display:block;font-size:19px;font-weight:500;line-height:1.3;letter-spacing:-.01em;margin-bottom:6px}
.p-concept-desc{display:block;font-size:15px;line-height:1.55;color:var(--muted)}
.p-concept-open{width:22px;height:22px;fill:none;stroke:var(--accent);stroke-width:1.5;transition:transform .3s}
.p-concept:hover img{transform:scale(1.04)}
.p-concept:hover .p-concept-open{transform:translateX(5px)}
.p-concept:hover .p-concept-title{text-decoration:underline;text-decoration-color:#a8855099;text-underline-offset:4px}

/* AI: all three uses visible at once */
.p-intelligence .ai-copy h2{max-width:11em}
.p-ai-list{list-style:none;margin:36px 0 0;padding:0}
.p-ai-list li{border-top:1px solid #ffffff2e;padding:22px 0 4px}
.p-ai-list h3{font-size:18px;font-weight:500;letter-spacing:-.01em;margin:0 0 10px;color:#f2ede2}
.p-ai-list p{font-size:16px;line-height:1.7;color:#cfd4c7;max-width:58ch;margin:0 0 18px}

/* Process: sticky heading, a bronze ladder of six steps */
.p-process{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:7%;align-items:start}
.p-process-head{position:sticky;top:48px}
.p-process-head p{font-size:17px;line-height:1.7;color:var(--muted);max-width:40ch;margin:28px 0 26px}
.p-steps{list-style:none;margin:0;padding:0;counter-reset:none}
.p-steps li{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:20px;padding:34px 0;border-top:1px solid var(--line)}
.p-steps li:last-child{border-bottom:1px solid var(--line)}
.p-steps li:not(:last-child)::after{content:"";position:absolute;left:19px;top:100px;bottom:-34px;width:1px;background:linear-gradient(var(--accent),#a8855026)}
.p-step-no{font-family:var(--display);font-size:46px;line-height:1;color:var(--accent)}
.p-steps h3{font-size:22px;font-weight:500;letter-spacing:-.015em;margin:4px 0 12px}
.p-steps p{font-size:16.5px;line-height:1.7;color:var(--muted);max-width:60ch;margin:0 0 14px}
.p-steps .p-step-out{font-size:15.5px;color:var(--ink);margin:0}
.p-step-out b{font-weight:600;color:var(--link)}

/* Footer */
footer.p-footer{display:block;background:var(--night);color:#ebe4d6;padding:clamp(72px,8vw,120px) var(--gutter) 34px;font-size:16px}
.p-footer-top{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:6%;align-items:end;padding-bottom:clamp(48px,6vw,80px);border-bottom:1px solid #ffffff1f}
.p-footer-name{font-family:var(--display);font-size:clamp(40px,6vw,92px);line-height:1.02;letter-spacing:-.03em;margin:0;max-width:10em}
.p-footer-what{font-size:17px;color:#b8b1a3;margin:0}
.p-footer-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:6%;padding:44px 0 64px}
.p-social-footer{margin:14px 0 0 -9px}
.p-footer-cols h2{font-family:var(--body);font-size:14px;font-weight:400;letter-spacing:0;color:#9a9486;margin:0 0 14px}
.p-footer-cols a{display:block;width:fit-content;padding:5px 0;color:#ebe4d6;transition:color .2s}
.p-footer-cols a:hover{color:var(--sand)}
.p-footer-bottom{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;font-size:14px;color:#9a9486}
.p-footer-bottom small{font-size:14px;color:#9a9486;margin:0 auto 0 0;grid-column:auto}
.p-footer-bottom a:hover{color:#ebe4d6}

@media(max-width:1280px){.p-header nav{gap:24px}.p-head-actions .p-social{display:none}}
@media(max-width:1100px){
 header.p-header{gap:20px}.p-header nav{gap:20px;font-size:14px}
 .p-service-list li{grid-template-columns:minmax(0,1fr) minmax(0,1fr);row-gap:14px}
 .p-service-list h3{grid-column:1/-1}
 .p-work-feature{grid-template-columns:1fr;gap:64px}
 .p-label{max-width:60ch}
 .p-plate-second{right:-2%}
 .p-concept-groups{grid-template-columns:1fr;gap:64px}
 .p-process{grid-template-columns:1fr;gap:40px}
 .p-process-head{position:static}
}
@media(max-width:760px){
 :root{--header-height:88px}
 .p-head-actions{display:none}
 .p-hero .hero-bottom p{font-size:16px}
 .p-hero-actions{gap:16px 24px}
 .p-btn{min-height:50px;padding:0 22px;font-size:15px}
 .p-section{padding:72px 16px}
 .p-section h2{font-size:clamp(34px,9vw,44px)}
 .p-services-head,.p-projects-head,.p-concepts-head{grid-template-columns:1fr;gap:22px;margin-bottom:44px}
 .p-service-list li{grid-template-columns:1fr;padding:28px 0}
 .p-service-list h3{font-size:30px}
 .p-service-list p{font-size:16px}
 .p-plates{padding:0}
 .p-plate-second{display:none}
 .p-framed::before{inset:-9px}.p-framed::after{inset:-5px}
 .p-work-feature{gap:40px;margin-bottom:96px}
 .p-label h3{font-size:36px}
 .p-label p{font-size:16px}
 .p-work-pair{grid-template-columns:1fr;gap:88px}
 .p-work-pair .p-work:nth-child(2){margin-top:0}
 .p-work-pair .p-label{margin-top:34px}
 .p-concept{grid-template-columns:96px minmax(0,1fr) 20px;gap:16px}
 .p-concept img{width:96px}
 .p-concept-title{font-size:17px}
 .p-concept-desc{font-size:14.5px}
 .p-steps li{grid-template-columns:44px minmax(0,1fr);gap:14px;padding:28px 0}
 .p-steps li:not(:last-child)::after{left:13px;top:84px;bottom:-28px}
 .p-step-no{font-size:36px}
 .p-steps h3{font-size:20px}
 .p-steps p{font-size:16px}
 .p-footer-top,.p-footer-cols{grid-template-columns:1fr}
 .p-footer-top{gap:18px}
 .p-footer-cols{gap:34px}
}
@media(prefers-reduced-motion:reduce){
 .p-framed::before,.p-framed::after{animation:none!important;clip-path:none}
 .p-plate,.p-concept img,.p-concept-open{transition:none}
 a.p-plate:hover{transform:none}
}
.p-footer-name{max-width:14em}

/* Header on phones: the menu button sits at the right edge of the grid */
@media(max-width:680px){header.p-header .menu-toggle{grid-column:3;justify-self:end}}

/* Real screens drift slightly inside their frames while the page scrolls */
.p-shot{display:block;overflow:hidden}
@supports (animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .p-shot img{scale:1.08;animation:p-pan linear both;animation-timeline:view();animation-range:cover}
  .p-plate-second{animation:p-float linear both;animation-timeline:view();animation-range:cover}
 }
}
@keyframes p-pan{from{translate:0 -3.5%}to{translate:0 3.5%}}
@keyframes p-float{from{translate:0 70px}to{translate:0 -50px}}

/* Assistant terminal */
.assistant-terminal{background:radial-gradient(120% 80% at 50% 0%,#2a2c22,#1b1d17 70%)}
.p-term-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 24px;border-bottom:1px solid #ffffff14;font:13px/1 Menlo,"DejaVu Sans Mono",monospace;color:#a39d8e}
.p-term-title i{font-style:normal;color:#6c675b;margin:0 6px}
.p-term-state{display:inline-flex;align-items:center;gap:8px}
.p-term-state i{width:7px;height:7px;border-radius:50%;background:#9fb38f;box-shadow:0 0 0 3px #9fb38f22}
.p-term-state[data-state=typing] i{background:#d8c4a0;box-shadow:0 0 0 3px #d8c4a022}
.p-term-state[data-state=thinking] i{background:#d8a85a;animation:p-lamp 1.1s ease-in-out infinite}
.p-term-state[data-state=error] i{background:#c8785e;box-shadow:0 0 0 3px #c8785e22}
@keyframes p-lamp{50%{opacity:.35;box-shadow:0 0 0 6px #d8a85a00}}
.assistant-pane .assistant-empty{display:flex;flex-direction:column;align-items:stretch;gap:26px;height:auto;min-height:100%}
.p-boot{font:15px/1.65 Menlo,"DejaVu Sans Mono",monospace;color:#cfc8b8}
.p-boot-line{margin:0 0 10px;max-width:62ch;min-height:1.65em}
.p-boot-line:first-child{color:#d8c4a0}
.p-boot-line:first-child::before{content:"> ";color:#8f8a7c}
.p-boot-line.is-typing::after{content:"";display:inline-block;width:8px;height:1.05em;margin-left:3px;background:#d8c4a0;vertical-align:text-bottom;animation:terminal-caret 1s steps(1) infinite}
.p-starters{display:flex;flex-direction:column;font-family:var(--body)}
.p-starters-label{font:12.5px/1.4 Menlo,"DejaVu Sans Mono",monospace;color:#8f8a7c;margin:0 0 10px}
.p-starters button{display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;align-items:center;width:100%;padding:11px 12px;border:0;border-top:1px solid #ffffff12;background:transparent;color:#ebe5d8;font-size:15.5px;line-height:1.4;text-align:left;transition:background .18s,color .18s}
.p-starters button:last-child{border-bottom:1px solid #ffffff12}
.p-starters kbd{display:grid;place-items:center;width:24px;height:24px;border:1px solid #d8c4a066;font:12px/1 Menlo,"DejaVu Sans Mono",monospace;color:#d8c4a0;transition:inherit}
.p-starters button:hover,.p-starters button:focus-visible{background:#d8c4a0;color:#1b1d17;outline:none}
.p-starters button:hover kbd,.p-starters button:focus-visible kbd{border-color:#1b1d1766;color:#1b1d17}
.is-booting .p-starters{visibility:hidden}
.is-booted .p-starters>*{animation:p-rise .5s cubic-bezier(.16,1,.3,1) both}
.is-booted .p-starters>:nth-child(2){animation-delay:.08s}.is-booted .p-starters>:nth-child(3){animation-delay:.16s}
.is-booted .p-starters>:nth-child(4){animation-delay:.24s}.is-booted .p-starters>:nth-child(5){animation-delay:.32s}
@keyframes p-rise{from{opacity:0;translate:0 8px}}
@media(max-width:760px){.p-term-bar{padding:12px 16px}.p-boot{font-size:14px}.p-starters button{font-size:14.5px;padding:12px 8px}}
@media(prefers-reduced-motion:reduce){.is-booted .p-starters>*{animation:none}.p-term-state i{animation:none}}
.assistant-log{overflow-anchor:none}
header.p-header .brand{justify-self:start;margin:0}
.p-social-footer span{opacity:.9}
.assistant-pane .assistant-meta{font-size:13px;line-height:1.55;color:#5a5d54;max-width:62ch}
.assistant-meta a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:#a8855099}
.p-footer-bottom small{margin-right:auto}
/* Intro hands focus to the logo; show its ring only to keyboard users */
html:not(.kbd-nav) header a.oeg-header-brand:focus-visible{outline:none!important}

/* Constructor invitation under the real projects */
.p-build{margin-top:clamp(80px,9vw,140px);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:6%;align-items:center;background:var(--night);color:#efe8da;padding:clamp(32px,4vw,56px);border:1px solid #a8855055;position:relative;overflow:hidden}
.p-build::before{content:"";position:absolute;inset:10px;border:1px solid #a8855033;pointer-events:none}
.p-build h3{font-family:var(--display);font-weight:400;font-size:clamp(28px,2.8vw,42px);line-height:1.12;letter-spacing:-.02em;margin:0 0 16px;max-width:20ch}
.p-build p{font-size:17px;line-height:1.65;color:#cfc8b8;max-width:52ch;margin:0}
.p-build-side{display:flex;flex-direction:column;align-items:flex-start;gap:24px;justify-self:end}
.p-build-swatches{display:flex;gap:8px}
.p-build-swatches i{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--b) 50%,var(--a) 50%);box-shadow:0 0 0 1px #ffffff26;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.p-build:hover .p-build-swatches i{transform:translateY(-4px)}
.p-build:hover .p-build-swatches i:nth-child(even){transform:translateY(3px)}
.p-build .p-btn-light span{margin-left:10px}
@media(max-width:900px){.p-build{grid-template-columns:minmax(0,1fr);gap:28px}.p-build-side{justify-self:start}}
@media(prefers-reduced-motion:reduce){.p-build-swatches i{transition:none}}
