/* Portfolio chapter: editorial product navigation and restrained spatial motion. */
:root{--portfolio-shadow:0 24px 70px rgba(43,25,19,.12)}
.present-invite{background:#e9ff9b;border-bottom:1px solid #c6dd70;padding:3.5rem 0}.present-invite-inner{display:flex;justify-content:space-between;align-items:center;gap:2rem}.present-invite span{font-size:.62rem;font-weight:800;letter-spacing:.16em;color:#5b5f20}.present-invite h2{font:800 clamp(2.1rem,3.7vw,4rem)/1.04 var(--sans);letter-spacing:-.075em;margin:.6rem 0}.present-invite p{max-width:650px;font-size:.84rem;line-height:1.7;color:#45482c;margin:0}.present-invite .button{flex-shrink:0}
.bot-field{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.contact-note a{color:#9d3f19;text-decoration:underline;text-underline-offset:3px}.contact-form button:disabled{opacity:.65;cursor:wait}
@media(max-width:760px){.present-invite-inner{align-items:start;flex-direction:column}.present-invite{padding:3rem 0}}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
.hero{position:relative;isolation:isolate}
.hero:after{content:"";position:absolute;right:-11vw;top:5rem;width:40vw;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#ffb390 0,rgba(255,179,144,.18) 39%,transparent 69%);filter:blur(18px);z-index:-1;pointer-events:none}
.hero-visual{perspective:1200px}
.preview-frame{transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .65s}
.hero-visual:hover .preview-frame{transform:perspective(1200px) rotateY(-5deg) rotateX(3deg) translateY(-8px);box-shadow:24px 30px 0 #f1d5c5,0 36px 70px rgba(57,29,17,.16)}
.hero-visual .preview-main{transform:translateZ(18px)}
.button,.header-cta,.demo-link{transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}
.button:hover,.header-cta:hover,.demo-link:hover{transform:translateY(-3px)}
.product-deck{padding:5.5rem 0 2rem;background:#fff;border-bottom:1px solid var(--line)}
.deck-intro{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:1.5rem}
.deck-intro h2{font:800 clamp(2.4rem,3.6vw,4rem)/1.05 var(--sans);letter-spacing:-.065em;margin:.7rem 0 0;max-width:650px}
.deck-controls{display:flex;align-items:center;gap:.75rem}
.deck-controls output{font-size:.72rem;font-weight:800;letter-spacing:.12em;min-width:3.7rem;text-align:center;color:#a54821}
.deck-arrow{display:grid;place-items:center;width:45px;height:45px;border:1px solid #d7ccc5;border-radius:50%;background:#fff;color:var(--ink);font-size:1.2rem;cursor:pointer;transition:background .2s,transform .2s}
.deck-arrow:hover{background:#fff1e8;transform:translateY(-2px)}
.deck-arrow:focus-visible,.catalog-filter:focus-visible{outline:3px solid #ff8e59;outline-offset:3px}
.deck-track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:1rem;scrollbar-width:none;padding:1.2rem 0 2rem}
.deck-track::after{content:"";flex:0 0 max(0px,calc(100% - min(79vw,450px) - 1rem))}
.deck-track::-webkit-scrollbar{display:none}
.deck-card{flex:0 0 min(79vw,450px);min-height:440px;scroll-snap-align:start;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;position:relative;color:#fff;background:#242024;box-shadow:var(--portfolio-shadow);transform:translateZ(0)}
.deck-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 28%,rgba(255,124,63,.3),transparent 48%),linear-gradient(135deg,#322329,#1e1b1e);pointer-events:none}
.deck-card[data-tone="cream"]{color:var(--ink);background:#f2e8de}
.deck-card[data-tone="cream"]:before{background:radial-gradient(circle at 76% 22%,#ffd9c5,transparent 47%),linear-gradient(145deg,#f5e9df,#eadbcd)}
.deck-card[data-tone="orange"]:before{background:linear-gradient(135deg,#ff641f,#d43b00)}
.deck-card[data-tone="graphite"]:before{background:radial-gradient(circle at 80% 25%,#765447,transparent 50%),#282324}
.deck-card>*{position:relative;z-index:1}
.deck-card-head{display:flex;justify-content:space-between;gap:1rem;padding:1.4rem 1.5rem;font-size:.62rem;letter-spacing:.1em;font-weight:800;border-bottom:1px solid currentColor;opacity:.82}
.deck-card-art{flex:1;display:grid;place-items:center;min-height:190px;perspective:800px;overflow:hidden}
.deck-object{width:64%;aspect-ratio:1.7;background:#fff;color:#252025;border:1px solid #e8d6c8;border-radius:12px;box-shadow:14px 17px 0 rgba(80,26,12,.28);transform:rotate(-7deg) rotateY(-12deg);transition:transform .6s cubic-bezier(.2,.8,.2,1);padding:1.2rem}
.deck-card:hover .deck-object{transform:rotate(-2deg) rotateY(0) translateY(-10px)}
.deck-object small{font-size:.54rem;font-weight:800;letter-spacing:.12em;color:#ad481e}
.deck-object strong{display:block;font-size:1.7rem;letter-spacing:-.065em;line-height:1.05;margin:.7rem 0}
.deck-object span{display:block;height:8px;background:#eee6df;border-radius:9px;margin:.4rem 0}
.deck-object span:nth-of-type(2){width:72%}.deck-object span:nth-of-type(3){width:44%;background:#ffc3a8}
.deck-card-copy{padding:1.5rem;background:rgba(18,15,18,.38);backdrop-filter:blur(9px)}
.deck-card[data-tone="cream"] .deck-card-copy{background:rgba(255,255,255,.64)}
.deck-card-copy h3{font:800 2rem/1.07 var(--sans);letter-spacing:-.055em;margin:0 0 .4rem}
.deck-card-copy p{font-size:.82rem;line-height:1.6;max-width:320px;margin:0 0 1rem;opacity:.83}
.deck-card-copy a{display:inline-flex;align-items:center;gap:.5rem;font-size:.72rem;font-weight:800;border-bottom:1px solid currentColor;padding-bottom:.15rem}
.deck-note{font-size:.68rem;letter-spacing:.05em;color:#81777b;margin:0}
.module-showcase{background:#f5eee7;padding:5.5rem 0;border-top:1px solid #eadbd0;border-bottom:1px solid #eadbd0}
.module-showcase-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:4vw;align-items:center}
.module-showcase h2{font:800 clamp(2.8rem,4.5vw,5.4rem)/1.03 var(--sans);letter-spacing:-.075em;margin:1rem 0}
.module-showcase p{color:#625b60;line-height:1.75;max-width:550px}
.module-showcase ul{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;list-style:none;padding:0;margin:1.8rem 0}
.module-showcase li{padding:.8rem 1rem;background:#fff;border:1px solid #e4d7cb;border-radius:7px;font-size:.75rem;font-weight:700}
.module-showcase li::before{content:"↗";color:var(--orange);margin-right:.6rem}
.module-showcase-visual{background:#fff;padding:1.2rem;border:1px solid #e5d6cc;border-radius:16px;box-shadow:16px 18px 0 #e4cbbd;transform:perspective(1200px) rotateY(-3deg) rotateX(2deg);transition:transform .55s}
.module-showcase-visual:hover{transform:perspective(1200px) rotateY(0) rotateX(0)}
.module-window{display:grid;grid-template-columns:155px 1fr;min-height:350px;border:1px solid #e8e1dd;border-radius:9px;overflow:hidden}
.module-nav{background:#fbfaf9;padding:1rem .65rem;border-right:1px solid #e7dfd9}
.module-nav img{width:28px;height:28px;object-fit:contain;margin:.25rem .5rem 1rem}
.module-nav span{display:block;padding:.4rem .65rem;border-radius:6px;font-size:.68rem;margin:.1rem 0}
.module-nav span.active{background:#fff0e9;color:#a44017;font-weight:800}
.module-nav .sub{padding-left:1.35rem;color:#777078}
.module-content{padding:1.8rem;min-width:0}
.module-content small{font-size:.58rem;letter-spacing:.13em;color:#a24823;font-weight:800}
.module-content h3{font:800 clamp(1.5rem,2.4vw,2.5rem)/1.1 var(--sans);letter-spacing:-.06em;margin:.7rem 0 1.2rem}
.module-content .module-line{display:flex;justify-content:space-between;gap:1rem;border-top:1px solid #eee7e1;padding:.8rem 0;font-size:.72rem}
.module-content .module-line b{color:#a4481f}
.catalog-heading{display:flex;align-items:end;justify-content:space-between;gap:1.5rem;margin-bottom:1.5rem}
.catalog-heading h2{font:800 clamp(2.7rem,4.5vw,5rem)/1.04 var(--sans);letter-spacing:-.07em;margin:.6rem 0}
.catalog-heading p{max-width:580px;color:#645e62;line-height:1.7}
.catalog-filters{display:flex;gap:.45rem;flex-wrap:wrap;margin:1.5rem 0}
.catalog-filter{background:#fff;border:1px solid #d9cfc8;border-radius:99px;padding:.6rem .95rem;font-size:.7rem;font-weight:800;cursor:pointer}
.catalog-filter[aria-pressed="true"]{background:#211c20;border-color:#211c20;color:#fff}
.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.catalog-card{background:#fff;border:1px solid #e4dcd6;border-radius:12px;padding:1.4rem;min-height:280px;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s}
.catalog-card:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(48,29,23,.1);border-color:#dbb39e}
.catalog-card[hidden]{display:none}
.catalog-card small{font-size:.56rem;letter-spacing:.12em;font-weight:800;color:#a34720}
.catalog-card h3{font:800 1.55rem/1.08 var(--sans);letter-spacing:-.06em;margin:2rem 0 .6rem}
.catalog-card p{font-size:.76rem;line-height:1.65;color:#635c61;margin:0 0 1rem}
.catalog-card a{font-size:.68rem;font-weight:800;border-bottom:1px solid #ad6848;width:max-content;margin-top:auto;padding-bottom:.15rem;color:#a34219}
.catalog-card .stage{display:inline-block;margin-top:auto;border-top:1px solid #eee4dd;padding-top:.75rem;color:#9f4e2b;font-size:.62rem;font-weight:800}
.catalog-card .stage+a{margin-top:.6rem}
.catalog-card .stage+a+a{margin-top:.55rem;color:#5f575b;border-color:#cbbdb4}
.catalog-count{color:#8b8083;font-size:.67rem;letter-spacing:.08em;font-weight:800;margin-top:1rem}
.marketing-feature{transition:transform .35s,box-shadow .35s}
.marketing-feature:hover{transform:translateY(-5px);box-shadow:0 24px 50px rgba(25,16,19,.17)}
.marketing-price{display:inline-block;margin-top:1rem;border:1px solid #a6664e;border-radius:99px;color:#ffb58f;padding:.42rem .7rem;font-size:.63rem;font-weight:800;letter-spacing:.04em}
.marketing-service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-top:1rem}
.marketing-service-list span{display:flex;align-items:center;gap:.55rem;padding:.75rem .8rem;background:#fff;border:1px solid #e8dcd3;border-radius:7px;font-size:.68rem;font-weight:700}
.marketing-service-list span:before{content:"✓";color:#ad4218}
.marketing-demo-link{display:inline-flex;margin-top:1rem;color:#fff;background:#ff530d;padding:.75rem 1rem;border-radius:7px;font-size:.72rem;font-weight:800}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.in-view{opacity:1;transform:none}
@media(max-width:1100px){.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.module-showcase-grid{grid-template-columns:1fr}.module-showcase-visual{max-width:800px}}
@media(max-width:700px){.product-deck,.module-showcase{padding:3.5rem 0}.deck-intro{align-items:start;flex-direction:column;gap:.8rem}.deck-intro h2{font-size:clamp(2.4rem,10vw,3.2rem)}.deck-controls{align-self:flex-end}.deck-track::after{flex-basis:max(0px,calc(100% - 84vw - 1rem))}.deck-card{flex-basis:84vw;min-height:390px}.deck-card-art{min-height:155px}.deck-object{width:66%;padding:.8rem}.deck-object strong{font-size:1.2rem}.deck-card-copy h3{font-size:1.65rem}.module-showcase ul{grid-template-columns:1fr 1fr}.module-window{grid-template-columns:110px 1fr;min-height:300px}.module-nav span{font-size:.54rem;padding:.36rem}.module-nav .sub{padding-left:.85rem}.module-content{padding:1rem}.module-content h3{font-size:1.4rem}.catalog-grid{grid-template-columns:1fr}.catalog-card{min-height:220px}.catalog-card h3{margin:1.3rem 0 .5rem}.marketing-service-list{grid-template-columns:1fr 1fr}.hero-visual:hover .preview-frame{transform:none}}
@media(max-width:420px){.module-showcase ul,.marketing-service-list{grid-template-columns:1fr}.module-window{grid-template-columns:93px 1fr}.deck-arrow{width:38px;height:38px}.deck-controls output{min-width:2.9rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.deck-card,.catalog-card,.marketing-feature,.module-showcase-visual,.preview-frame,.button,.header-cta,.demo-link{transition:none!important}.hero-visual:hover .preview-frame,.deck-card:hover .deck-object,.module-showcase-visual:hover{transform:none}}
.demo-invite{background:#ff530d;color:#fff;padding:5rem 0;position:relative;overflow:hidden}
.demo-invite::before{content:"";position:absolute;inset:-50% -5% auto auto;width:46vw;height:46vw;border:1px solid #ffffff40;border-radius:50%;pointer-events:none}
.demo-invite::after{content:"";position:absolute;inset:auto -11% -87% auto;width:44vw;height:44vw;border:1px solid #ffffff35;border-radius:50%;pointer-events:none}
.demo-invite-inner{position:relative;z-index:1;display:grid;grid-template-columns:1.3fr .7fr;gap:5rem;align-items:end}
.demo-invite .eyebrow.light{color:#ffe1d4}
.demo-invite h2{font:800 clamp(3rem,5vw,5.5rem)/1.04 var(--sans);letter-spacing:-.07em;max-width:850px;margin:1.4rem 0}
.demo-invite p{color:#fff0e9;line-height:1.7;max-width:580px;margin:0}
.demo-invite-action{display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
.demo-invite .button{background:#211c20;color:#fff}
.demo-invite .button:hover{background:#fff;color:#211c20}
.demo-invite-action>span{font-size:.6rem;font-weight:800;letter-spacing:.1em;color:#ffdfd0;line-height:1.6}
@media(max-width:800px){.demo-invite{padding:4rem 0}.demo-invite-inner{grid-template-columns:1fr;gap:2rem}.demo-invite h2{font-size:clamp(2.9rem,10vw,4rem)}}
