/* Pencil Glow: own editorial structure, shared fluid interaction language. */
.pencil-original{--paper:#f5f4f8;--purple:#6638ed;background:var(--paper)}
.pencil-original h1,.pencil-original h2{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;text-transform:none;letter-spacing:-.055em;font-weight:650;line-height:1.08}
.pencil-original h2{font-size:clamp(36px,4.2vw,64px)}
.pencil-original .site-nav{padding:20px 5%;background:#f5f4f8e8;backdrop-filter:blur(16px);color:var(--navy);border-bottom:1px solid #1724420c}
.pencil-original .brand img{filter:none;width:154px}.pencil-original .brand span{color:var(--purple);font-size:10px}
.pencil-original .menu-button{color:var(--navy);background:#ffffff85;border-color:#17244224}
.pencil-original .nav-cta{background:var(--navy);color:white;border-color:var(--navy);font-size:13px;padding:12px 20px}
.pencil-original .pill{font-size:14px;text-transform:none;letter-spacing:0;transition:transform .45s cubic-bezier(.16,1,.3,1),background .3s}
.pencil-original .pill:hover{transform:translateY(-2px)}
.pencil-original .hero{display:grid;grid-template-columns:1.03fr 1fr;gap:5%;align-items:center;min-height:780px;height:auto;padding:165px 6% 95px;background:var(--paper);color:var(--navy);overflow:hidden}
.hero-copy{max-width:670px}.hero-copy .eyebrow{font-size:10px;letter-spacing:.17em;color:var(--purple);margin-bottom:26px}
.pencil-original .hero h1{font-size:clamp(44px,5.3vw,79px);line-height:1.04;margin:0;max-width:none}.pencil-original .hero h1 span{color:var(--purple);display:inline}
.hero-lead{font-size:17px;line-height:1.8;color:#546073;max-width:480px;margin-top:29px}
.pencil-original .hero-actions{display:flex;gap:24px;align-items:center;margin-top:34px;flex-wrap:wrap}.hero-actions .pill{background:var(--purple);color:white;border-color:var(--purple)}
.pencil-original .underlink{font-size:13px;color:var(--navy)}
.hero-package{display:flex;align-items:center;gap:22px;border-top:1px solid #1724421c;margin-top:38px;padding-top:24px;max-width:420px}
.hero-package strong{font-size:32px;letter-spacing:-.05em}.hero-package span{font-size:12px;line-height:1.8;color:#596477}
.hero-art{position:relative;min-height:490px;perspective:1100px;isolation:isolate}
.art-orbit{position:absolute;inset:9% -7% 5%;border:1px solid #6638ed1f;border-radius:50%;background:radial-gradient(ellipse at center,#c9beff66,transparent 68%);transform:rotate(-15deg)}
.hero-slide{position:absolute;border-radius:10px;border:1px solid #ffffffa6;box-shadow:0 28px 60px #17244228;width:92%;will-change:transform}
.hero-slide-back{top:6%;right:-4%;transform:rotate(8deg) translateY(var(--hero-drift,0px))}
.hero-slide-front{top:33%;left:-2%;transform:rotate(-7deg) translateY(calc(var(--hero-drift,0px)*-.65))}
.art-caption{position:absolute;bottom:0;left:10%;right:0;display:flex;align-items:center;gap:9px;font-size:11px;color:#657185}.small-dot{width:7px;height:7px;background:var(--purple);border-radius:50%}
.pencil-original .work{padding:90px 6% 85px;background:#fff;color:var(--navy)}
.pencil-original .work-heading{align-items:end;margin-bottom:36px;gap:35px}.pencil-original .work-heading .eyebrow{font-size:10px;color:var(--purple);margin-bottom:18px}.pencil-original .work-heading p{font-size:15px;line-height:1.8;max-width:330px;color:#657185}
.pencil-original .work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pencil-original .work-card,.pencil-original .work-card.proposal{grid-column:auto;aspect-ratio:.83;border-radius:16px}
.pencil-original .work-card.proposal>img.card-front{width:87%;transform:translate(var(--hover-x),calc(-13% + var(--hover-y))) rotate(calc(var(--card-rotation)*(1 - var(--hover-amount)*3.3333))) scale(calc(1 - var(--hover-amount)))}
.pencil-original .card-top{font-size:9px}.pencil-original .card-caption{left:24px;right:20px;bottom:25px}.pencil-original .card-caption h3{font-size:23px}.pencil-original .card-caption>span:first-child{font-size:11px}
.pencil-original .work-foot{margin-top:30px}.pencil-original .work-foot p{font-size:11px;color:#7b8493;max-width:200px}
.pencil-original .own-approach{padding:85px 6%;background:var(--paper);color:var(--navy);border-radius:0;margin:0}
.pencil-original .section-label{font-size:9px;letter-spacing:.1em;margin-bottom:30px;opacity:.8}
.pencil-original .intro-layout{grid-template-columns:1fr 1fr;gap:10%;align-items:start}.pencil-original .intro-right .editorial{font-size:19px;line-height:1.65}.pencil-original .intro-right>p+p{font-size:14px;color:#657185}.pencil-original .intro-right .pill{margin-top:25px}
.pencil-original .media-world{height:145svh;min-height:900px;background:#101b36}.pencil-original .world-copy h2{font-size:clamp(45px,6vw,85px)}.pencil-original .world-copy{top:16%;max-width:600px}.pencil-original .world-copy p{font-size:14px}.pencil-original .world-sticky{min-height:620px}
.pencil-original .package{padding:90px 6%;background:#ece8fa;color:var(--navy)}.pencil-original .package-intro{font-size:16px;line-height:1.8;color:#596477;max-width:410px}.pencil-original .package-price>span{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:64px;letter-spacing:-.06em}.pencil-original .package-price p{font-size:14px}.pencil-original .package .pill{background:var(--purple);color:white;border-color:var(--purple)}
.pencil-original .deliverable h3{font-size:19px}.pencil-original .deliverable p,.pencil-original .package-note p{font-size:13px;line-height:1.85}.pencil-original .package-numbers{margin-top:45px;padding-top:25px;border-color:#17244225}.pencil-original .package-numbers strong{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:42px}.pencil-original .package-numbers span{font-size:9px;color:#657185}
.pencil-original .process{padding:85px 6%;background:white}.pencil-original .process-grid{margin-top:40px;gap:38px}.pencil-original .process-grid h3{font-size:20px}.pencil-original .process-grid p{font-size:14px;line-height:1.8}.pencil-original .step{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:23px;color:var(--purple)}
.pencil-original .faq{padding:80px 6%;background:var(--paper);gap:10%}.pencil-original .faq summary{font-size:16px}.pencil-original .faq details p{font-size:14px;line-height:1.8}
.pencil-original .contact{padding:85px 6%;background:var(--navy);color:white}.pencil-original .contact h2{font-size:clamp(42px,5.7vw,80px);max-width:1000px}.pencil-original .contact h2 span{color:#b8a6ff}.pencil-original .contact-bottom{margin-top:40px;gap:10%}.pencil-original .contact-bottom p{font-size:15px}.pencil-original .contact .small-note{font-size:11px;color:#b4bdce}.pencil-original .contact .pill{background:#b8a6ff;color:#111c36;border-color:transparent}.pencil-original .contact-email{font-size:15px}
.pencil-original .site-footer{background:var(--navy);color:#d3d9e5;padding:0 6% 30px}.pencil-original .footer-top{padding-top:25px;border-top:1px solid #ffffff24}.pencil-original .footer-bottom{font-size:11px}
.pencil-original .gallery-hero{padding:150px 6% 65px;background:var(--paper);color:var(--navy)}.pencil-original .gallery-hero h1{font-size:clamp(46px,6vw,84px)}.pencil-original .gallery-intro p{font-size:17px}.pencil-original .gallery-project{padding:65px 6%}.pencil-original .project-heading h2{font-size:42px}
.pencil-original .menu-layout nav a{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;text-transform:none;letter-spacing:-.045em;font-size:clamp(30px,4vw,56px);line-height:1.1}.pencil-original .menu-layout nav{gap:20px}.pencil-original .menu-panel{background:var(--paper)}
@media(max-width:1000px){.pencil-original .hero{min-height:700px;padding-top:145px;gap:3%}.hero-art{min-height:380px}.hero-lead{font-size:15px}.pencil-original .work-grid{gap:14px}.pencil-original .card-caption h3{font-size:19px}.pencil-original .card-caption{left:18px}}
@media(max-width:760px){.pencil-original .site-nav{padding:14px 5%}.pencil-original .brand img{width:135px}.pencil-original .hero{grid-template-columns:1fr;padding:120px 6% 60px;gap:40px;min-height:0}.pencil-original .hero h1{font-size:clamp(42px,10vw,64px)}.hero-lead{font-size:15px;margin-top:23px}.hero-copy .eyebrow{font-size:8px}.pencil-original .hero-actions{gap:20px;margin-top:27px}.hero-package{margin-top:28px;padding-top:20px}.hero-art{min-height:360px;width:94%;max-width:500px;margin:0 auto}.hero-slide{width:90%}.hero-slide-front{top:34%}.art-caption{bottom:0;left:3%;font-size:10px}.pencil-original .work,.pencil-original .own-approach,.pencil-original .package,.pencil-original .process,.pencil-original .faq,.pencil-original .contact{padding:60px 6%}.pencil-original .work-heading{display:block}.pencil-original .work-heading p{margin-top:22px}.pencil-original .work-grid{grid-template-columns:1fr;gap:22px}.pencil-original .work-card,.pencil-original .work-card.proposal{aspect-ratio:1.06}.pencil-original .card-caption h3{font-size:25px}.pencil-original .intro-layout{grid-template-columns:1fr;gap:28px}.pencil-original .intro-right .editorial{font-size:17px}.pencil-original .work-foot{align-items:start;gap:20px}.pencil-original .world-copy h2{font-size:48px}.pencil-original .world-copy{top:17%;left:6%;right:6%}.pencil-original .media-world{min-height:850px;height:135svh}.pencil-original .world-sticky{min-height:580px}.pencil-original .package-price>span{font-size:55px}.pencil-original .package-numbers strong{font-size:34px}.pencil-original .process-grid{gap:30px}.pencil-original .contact h2{font-size:43px}.pencil-original .menu-layout nav a{font-size:37px}.pencil-original .gallery-hero{padding:125px 6% 55px}.pencil-original .project-heading h2{font-size:35px}}
@media(max-width:390px){.hero-art{min-height:300px}.pencil-original .hero-actions{gap:15px}.pencil-original .hero h1{font-size:42px}.hero-package{gap:16px}.hero-package span{font-size:11px}.pencil-original .contact h2{font-size:37px}}
@media(prefers-reduced-motion:reduce){.hero-slide{transform:none}.pencil-original .media-world{height:auto;min-height:0}}
.user-reduced-motion .hero-slide{transform:none}.user-reduced-motion .media-world{height:auto;min-height:0}
.pencil-original .hero h1>span{white-space:normal}
.pencil-original .package h2 span{color:var(--purple)}
.pencil-original .package .section-label,.pencil-original .package-price p,.pencil-original .package-note,.pencil-original .package-note p,.pencil-original .package .deliverable p{color:#546073}
.pencil-original .package-numbers strong,.pencil-original .package .deliverable h3{color:var(--navy)}
.pencil-original .package .deliverable>span{color:var(--purple)}
.pencil-original .package-note,.pencil-original .deliverable{border-color:#17244224}
.pencil-original .gallery-hero h1 span,.pencil-original .intro h2>span{color:var(--purple)}
.pencil-original .gallery-end h2 span{color:white}
.pencil-original a:focus-visible,.pencil-original button:focus-visible,.pencil-original summary:focus-visible{outline-color:var(--purple)}
.pencil-original .contact a:focus-visible,.pencil-original .media-world a:focus-visible,.pencil-original .site-footer a:focus-visible,.pencil-original .gallery-end a:focus-visible{outline-color:var(--cyan)}
.pencil-original .media-world[data-scene-fallback],.lite-scenes .pencil-original .media-world{height:auto;min-height:0}
@media(min-width:371px) and (max-width:410px){.pencil-original .brand img{width:120px}.pencil-original .brand{gap:8px}.pencil-original .menu-button{padding:9px 13px;gap:13px}}

/* Consistent brand typography with a lighter semi-bold hierarchy. */
.pencil-original{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-weight:400}
.pencil-original h1,.pencil-original h2,.pencil-original h3,.pencil-original .menu-layout nav a{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-weight:650}
.pencil-original strong,.pencil-original .package-price>span{font-weight:650}

.pencil-original{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;font-size:17px;line-height:1.55;font-weight:400}
/* Presentation enquiry: clear labels, comfortable touch targets. */
.pencil-original .contact-with-form{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:7%;margin-top:42px}
.enquiry-copy>p{max-width:390px}.enquiry-copy .small-note{margin-top:24px}.enquiry-copy .contact-email{display:inline-block;margin-top:26px}
.design-enquiry{background:#fff;color:var(--navy);padding:30px;border-radius:18px;min-width:0}
.enquiry-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px 18px}.enquiry-fields label{display:flex;flex-wrap:wrap;align-content:start;gap:7px;font-size:12px;font-weight:600;line-height:1.5;min-width:0}.enquiry-fields .full-field{grid-column:1/-1}.enquiry-fields .optional{font-weight:400;color:#6d7788}
.enquiry-fields input,.enquiry-fields select,.enquiry-fields textarea{display:block;width:100%;min-width:0;min-height:46px;border:1px solid #cbd0da;border-radius:8px;background:#fafbfe;color:#172442;font:400 16px/1.45 -apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;padding:11px 12px;box-sizing:border-box}.enquiry-fields textarea{resize:vertical;min-height:125px}.enquiry-fields input:focus,.enquiry-fields select:focus,.enquiry-fields textarea:focus{outline:2px solid var(--purple);outline-offset:2px;border-color:var(--purple)}
.pencil-original .contact .design-enquiry p{font-size:11px;line-height:1.75;color:#596477}.design-enquiry .form-help{margin-top:18px}.design-enquiry .form-privacy{margin:14px 0 20px}.design-enquiry a{text-decoration:underline}.pencil-original .contact .design-enquiry .pill{background:var(--purple);color:white;min-height:46px}.design-enquiry button:disabled{opacity:.6}
.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.design-enquiry #enquiry-status{margin-top:18px;font-size:13px;padding:12px;border-radius:8px}.design-enquiry #enquiry-status[data-state="success"]{background:#e8f6ec;color:#1d5731}.design-enquiry #enquiry-status[data-state="error"]{background:#fff0ee;color:#8f2c1b}.design-enquiry #enquiry-status[data-state="pending"]{background:#f0edff;color:#49318d}
.enquiry-privacy{border-top:1px solid #dce0e8;margin-top:22px;padding-top:16px}.enquiry-privacy summary{cursor:pointer;font-size:12px}.enquiry-privacy p{margin-top:12px}
@media(max-width:760px){.pencil-original .contact-with-form{grid-template-columns:1fr;gap:28px}.design-enquiry{padding:23px}.enquiry-fields{gap:17px 14px}.enquiry-copy>p{max-width:none}}
@media(max-width:420px){.enquiry-fields{grid-template-columns:1fr}.enquiry-fields .full-field{grid-column:auto}.design-enquiry{padding:20px}}

/* Tessellate: selected deck pages, without invented before/after comparisons. */
.pencil-original .work-card.tessellate{background:#121826;color:#fff;aspect-ratio:1.2}
.pencil-original .work-card.tessellate .card-caption,.pencil-original .work-card.tessellate .card-top{color:#fff}
.deck-selections{display:grid;gap:32px}.deck-selections figure{margin:0;min-width:0}.deck-selections .enlarge{display:block;width:100%;padding:0;border:0;background:#121826;cursor:zoom-in;border-radius:12px;overflow:hidden}.deck-selections .enlarge img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}.deck-selections figcaption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:12px;font-size:14px;color:#546073}
@media(max-width:760px){.pencil-original .work-card.tessellate{aspect-ratio:1.06}.deck-selections{gap:24px}}

/* Additional portfolio deck selections. */
.pencil-original .work-card.halcyon-quay{background:#e9dac3}
.pencil-original .work-card.mossline{background:#305342}
.pencil-original .work-card.pulsefield{background:#e2e9ef}
.pencil-original .work-card.kopi-theory{background:#e8c99c}
.pencil-original .work-card.portfolio-deck{aspect-ratio:1.2}.pencil-original .work-card.mossline,.pencil-original .work-card.mossline .card-top,.pencil-original .work-card.mossline .card-caption{color:#fff}@media(max-width:760px){.pencil-original .work-card.portfolio-deck{aspect-ratio:1.06}}

.pencil-original .work-card.stackyard{background:#313648}
.pencil-original .work-card.orrin-gardens{background:#d5ddd4}
.pencil-original .work-card.larkspur{background:#efe9e2}
.pencil-original .work-card.sprout-sum{background:#f3e7b5}
.pencil-original .work-card.atelier-sela{background:#e8d7c7}
.pencil-original .work-card.stackyard,.pencil-original .work-card.stackyard .card-caption,.pencil-original .work-card.stackyard .card-top{color:#fff}
