/*
 * Design 4.0 — Design Services, General Supply Solutions, Promotional Products.
 * Loaded only on those three pages, after v35.
 */

/* Shared ------------------------------------------------------------------ */
.tp40-tag{top:12px;left:12px;z-index:4}
.tp40-n{font:600 1rem/1 var(--tp3-serif);color:var(--tp3-gold)}
.tp40-chips{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.tp40-chips li{padding:7px 11px;border-radius:99px;background:#fffdf8f0;font:700 .7rem/1 var(--tp3-sans);color:var(--tp3-ink);box-shadow:0 10px 20px -10px #0008}
.tp40-chips.is-dark li{background:#0b2328e6;color:#fff}
.tp40-js .tp40-chips li{opacity:0;transform:translateY(12px) scale(.9)}
.tp40-js .is-in .tp40-chips li{animation:tp40-pop .6s calc(.35s + var(--k) * .13s) var(--tp3-ease) forwards}
@keyframes tp40-pop{to{opacity:1;transform:none}}
.tp40-js [data-tp40-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s calc(var(--k,0) * .1s) var(--tp3-ease),transform .9s calc(var(--k,0) * .1s) var(--tp3-ease)}
.tp40-js [data-tp40-reveal].is-in{opacity:1;transform:none}
video[data-tp40-clip]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@keyframes tp40-dash{to{stroke-dashoffset:-16}}

/* 1. Design: your material → our design ------------------------------------ */
.tp40-ba-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.4vw,30px)}
.tp40-ba{overflow:hidden;border:1px solid var(--tp3-line);border-radius:18px;background:#fff;transition:box-shadow .6s var(--tp3-ease)}
.tp40-ba:hover{box-shadow:var(--tp3-shadow-2)}
.tp40-ba-visual{--pos:50%;position:relative;aspect-ratio:16/10;overflow:hidden;background:#efe9da;user-select:none}
.tp40-after,.tp40-before{position:absolute;inset:0}
.tp40-after img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tp40-after .tp40-tag{left:auto;right:12px}
.tp40-before{z-index:2;clip-path:inset(0 calc(100% - var(--pos)) 0 0);background:#f4f0e4 radial-gradient(circle at 30% 20%,#faf7ee,transparent 70%);display:grid;place-items:center}
.tp40-divider{position:absolute;top:0;bottom:0;left:var(--pos);z-index:3;width:2px;margin-left:-1px;background:#fff;box-shadow:0 0 0 1px #0b232833,0 0 18px #0006;pointer-events:none}
.tp40-divider i{position:absolute;top:50%;left:50%;display:grid;place-items:center;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:#fff;color:var(--tp3-ink);font:700 1rem/1 var(--tp3-sans);font-style:normal;box-shadow:0 8px 20px -6px #0007}
.tp40-lab{position:absolute;bottom:12px;z-index:3;padding:6px 10px;border-radius:99px;font:700 .6rem/1 var(--tp3-sans);letter-spacing:.14em;text-transform:uppercase;pointer-events:none}
.tp40-lab.l{left:12px;background:#0b2328cc;color:#fff}.tp40-lab.r{right:12px;background:#e0b04a;color:#0b2328}
.tp40-range{position:absolute;inset:0;z-index:5;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;-webkit-appearance:none;appearance:none;background:none}
.tp40-range:focus-visible+*,.tp40-ba-visual:focus-within .tp40-divider i{outline:3px solid var(--tp3-cyan)}
.tp40-ba-body{padding:20px 24px 24px}
.tp-editorial .tp40-ba h3{margin:8px 0 8px;font:500 clamp(1.5rem,2.2vw,1.9rem)/1.1 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-ba p{margin:0;color:var(--tp3-muted);line-height:1.6}
/* Raw material drawings */
.tp40-raw.is-doc{position:relative;width:min(46%,210px);aspect-ratio:3/4;padding:26px 16px 14px;border-radius:3px;background:#fff;box-shadow:0 18px 30px -18px #0007;display:flex;flex-direction:column;gap:7px}
.tp40-raw.is-doc b{position:absolute;top:8px;left:12px;font:700 .56rem/1 var(--tp3-sans);letter-spacing:.06em;color:#2b579a}
.tp40-raw.is-doc i{display:block;height:4px;border-radius:2px;background:#cfd6d8}
.tp40-raw.is-doc i:nth-child(4n){width:62%}.tp40-raw.is-doc i:nth-child(5n+2){width:86%}
.tp40-raw.is-mix{position:relative;width:100%;height:100%}
.tp40-raw.is-mix>.is-doc{position:absolute;left:12%;top:14%;transform:rotate(-4deg)}
.tp40-raw .ph{position:absolute;width:24%;aspect-ratio:4/3;border:5px solid #fff;background:linear-gradient(135deg,#9fb3b0,#51666a);box-shadow:0 12px 24px -12px #0007}
.tp40-raw .ph.p1{right:12%;top:14%;transform:rotate(6deg)}.tp40-raw .ph.p2{right:22%;bottom:18%;transform:rotate(-8deg);background:linear-gradient(135deg,#e0b04a,#b8862f)}
.tp40-raw .logo{position:absolute;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;border:2px dashed #0b2328;font:800 .6rem/1 var(--tp3-sans);letter-spacing:.1em;color:#0b2328;background:#fff}
.tp40-raw.is-mix .logo{left:58%;top:48%}
.tp40-raw.is-stack{position:relative;width:min(46%,210px);aspect-ratio:3/4}
.tp40-raw.is-stack .sheet{position:absolute;inset:0;border-radius:3px;background:#fff;box-shadow:0 10px 20px -12px #0006}
.tp40-raw.is-stack .s3{transform:rotate(7deg) translate(10px,6px)}.tp40-raw.is-stack .s2{transform:rotate(-5deg) translate(-8px,4px)}
.tp40-raw.is-stack .s1{width:100%}
.tp40-raw.is-brief{position:relative;width:100%;height:100%}
.tp40-raw.is-brief .logo{left:14%;top:18%;width:88px;height:88px}
.tp40-raw.is-brief .sw{position:absolute;top:24%;width:34px;height:34px;border-radius:6px;background:var(--c);box-shadow:0 6px 12px -6px #0007}
.tp40-raw.is-brief .sw:nth-of-type(2){left:40%}.tp40-raw.is-brief .sw:nth-of-type(3){left:48%}.tp40-raw.is-brief .sw:nth-of-type(4){left:56%}
.tp40-raw.is-brief .note{position:absolute;left:36%;top:48%;width:38%;padding:24px 12px 12px;background:#fff8c9;box-shadow:0 12px 22px -12px #0007;transform:rotate(-3deg);display:flex;flex-direction:column;gap:6px}
.tp40-raw.is-brief .note b{position:absolute;top:8px;left:10px;font:700 .56rem/1 var(--tp3-sans);color:#7a6400}
.tp40-raw.is-brief .note i{display:block;height:4px;border-radius:2px;background:#d9cf8f}
/* Book cover drawn on the blank mockup */
.tp40-cover{position:absolute;left:43.6%;top:18.5%;width:30.4%;height:60%;z-index:2;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;background:linear-gradient(160deg,#04424c,#0b2328);color:#f0c063;text-align:center;box-shadow:inset -8px 0 14px -10px #0009}
.tp40-cover .band{position:absolute;left:12%;right:12%;top:14%;height:2px;background:#e0b04a}
.tp40-cover b{font:600 clamp(.9rem,1.6vw,1.35rem)/1.05 var(--tp3-serif);padding:0 10%}
.tp40-cover em{font:600 .58rem/1 var(--tp3-sans);letter-spacing:.16em;text-transform:uppercase;font-style:normal;opacity:.85}
.tp40-cover .mark{position:absolute;bottom:12%;width:22px;height:22px;border-radius:50%;border:2px solid #e0b04a}
.tp40-spine{position:absolute;left:26.6%;top:18.5%;width:2.6%;height:60%;z-index:2;background:linear-gradient(90deg,#022c33,#04424c)}
.tp40-js .tp40-cover,.tp40-js .tp40-spine{clip-path:inset(0 0 100% 0)}
.tp40-js .is-in .tp40-cover,.tp40-js .is-in .tp40-spine{animation:tp40-print 1.4s .6s var(--tp3-ease) forwards}
@keyframes tp40-print{to{clip-path:inset(0 0 0 0)}}

/* 2. Promotional: three points --------------------------------------------- */
.tp40-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.tp40-point{overflow:hidden;border:1px solid var(--tp3-line);border-radius:18px;background:#fff;transition:transform .6s var(--tp3-ease),box-shadow .6s}
.tp40-point:hover{transform:translateY(-6px);box-shadow:var(--tp3-shadow-2)}
.tp40-point-visual{position:relative;aspect-ratio:4/3.3;overflow:hidden;background:var(--tp3-ink)}
.tp40-point-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--tp3-ease)}
.tp40-point:hover .tp40-point-visual>img{transform:scale(1.05)}
.tp40-point-body{padding:20px 22px 24px}
.tp-editorial .tp40-point h3{margin:8px 0 8px;font:500 1.55rem/1.1 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-point p{margin:0;color:var(--tp3-muted);line-height:1.6;font-size:.94rem}

/* 3. Service details: picture cards --------------------------------------- */
.tp40-details{background:#fffdf8}
.tp40-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.tp40-detail{display:grid;grid-template-rows:auto 1fr;overflow:hidden;border:1px solid var(--tp3-line);border-radius:18px;background:#fff;transition:transform .6s var(--tp3-ease),box-shadow .6s}
.tp40-detail:hover{transform:translateY(-6px);box-shadow:var(--tp3-shadow-2)}
.tp40-detail-visual{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--tp3-ink)}
.tp40-detail-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tp40-detail-body{padding:22px 24px 26px}
.tp-editorial .tp40-detail h2{margin:8px 0 10px;font:500 clamp(1.45rem,2vw,1.8rem)/1.1 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-detail p{margin:0 0 12px;color:var(--tp3-muted);line-height:1.6;font-size:.94rem}
/* Design only / design + printing fork */
.tp40-fork{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:center;padding:18px 14px;background:radial-gradient(120% 120% at 0 0,#0a5b67,var(--tp3-ink))}
.tp40-fork span{display:block;padding:10px 10px;border-radius:10px;background:#ffffff14;color:#fff;font:700 .74rem/1.25 var(--tp3-sans)}
.tp40-fork small{display:block;margin-top:4px;font-weight:500;font-size:.64rem;color:#cfdcd8}
.tp40-fork .src{background:#fffdf8;color:var(--tp3-ink)}.tp40-fork .src small{color:var(--tp3-muted)}
.tp40-fork svg{width:100%;height:auto;overflow:visible}
.tp40-fork path{fill:none;stroke:#f0c063;stroke-width:2;stroke-dasharray:5 5;animation:tp40-dash 1s linear infinite}
.tp40-fork circle{fill:#fff;filter:drop-shadow(0 0 4px #f0c063)}
.tp40-fork .out{grid-column:3}
.tp40-fork .o1{grid-row:1;align-self:end;margin-bottom:10px}.tp40-fork .o2{grid-row:2;align-self:start;margin-top:10px;border:1px solid #f0c06366}
.tp40-fork .src{grid-row:1 / span 2}.tp40-fork svg{grid-column:2;grid-row:1 / span 2}
/* Remote exchange loop */
.tp40-loop{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:8px 10px;border-radius:99px;background:#0b2328cc;backdrop-filter:blur(6px);color:#fff;font:700 .66rem/1 var(--tp3-sans)}
.tp40-loop span{padding:6px 8px;border-radius:99px}
.tp40-loop i{font-style:normal;color:#f0c063}
.is-in .tp40-loop span{animation:tp40-hl 4.5s infinite}
.is-in .tp40-loop span:nth-of-type(2){animation-delay:1.5s}.is-in .tp40-loop span:nth-of-type(3){animation-delay:3s}
@keyframes tp40-hl{0%,28%{background:var(--tp3-gold-soft);color:#0b2328}33%,100%{background:transparent;color:#fff}}
/* Placement approval over the blank mugs */
.tp40-place{position:absolute;inset:0;z-index:2;pointer-events:none}
.tp40-place .area{position:absolute;left:56%;top:40%;width:17%;height:24%;border:1.5px dashed #c2187f;border-radius:4px;display:grid;place-items:center}
.tp40-place .logo{font:800 .6rem/1 var(--tp3-sans);letter-spacing:.08em;color:#0b2328;padding:6px 6px;border:2px solid #0b2328;border-radius:4px;background:#ffffffcc}
.tp40-place .dim{position:absolute;font:700 .55rem/1 var(--tp3-sans);color:#c2187f;letter-spacing:.08em;text-transform:uppercase}
.tp40-place .dim.h{left:56%;width:17%;top:calc(40% - 16px);text-align:center;border-bottom:1px solid #c2187f;padding-bottom:3px}
.tp40-place .dim.v{left:calc(73% + 6px);top:40%;height:24%;writing-mode:vertical-rl;border-left:1px solid #c2187f;padding-left:3px;display:flex;align-items:center}
.tp40-place .pin{position:absolute;left:30%;top:22%;padding:5px 8px;border-radius:99px;background:#0b2328;color:#fff;font:700 .58rem/1 var(--tp3-sans);letter-spacing:.08em;text-transform:uppercase}
.tp40-place .sw{position:absolute;left:30%;top:calc(22% + 26px);width:18px;height:18px;border-radius:4px;background:var(--c);box-shadow:0 4px 8px -4px #0008}.tp40-place .sw.s2{left:calc(30% + 22px)}
.tp40-place .stamp{position:absolute;right:8%;bottom:14%;padding:6px 12px;border:3px solid #1f7a4d;border-radius:6px;font:800 .78rem/1 var(--tp3-sans);letter-spacing:.18em;text-transform:uppercase;color:#1f7a4d;transform:rotate(-10deg)}
.tp40-js .tp40-place .area,.tp40-js .tp40-place .dim,.tp40-js .tp40-place .pin,.tp40-js .tp40-place .sw,.tp40-js .tp40-place .stamp{opacity:0}
.tp40-js .is-in .tp40-place .area{animation:tp40-fade .6s .4s forwards}
.tp40-js .is-in .tp40-place .dim{animation:tp40-fade .6s .9s forwards}
.tp40-js .is-in .tp40-place .pin,.tp40-js .is-in .tp40-place .sw{animation:tp40-fade .6s 1.3s forwards}
.tp40-js .is-in .tp40-place .stamp{animation:tp40-stamp .5s 2s cubic-bezier(.2,1.6,.4,1) forwards}
@keyframes tp40-fade{to{opacity:1}}
@keyframes tp40-stamp{from{opacity:0;transform:rotate(-10deg) scale(1.8)}to{opacity:.9;transform:rotate(-10deg) scale(1)}}
/* Destination arc */
.tp40-ship{position:absolute;left:12px;right:12px;top:48px;z-index:3;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:10px 12px;border-radius:14px;background:#0b2328b3;backdrop-filter:blur(6px);color:#fff;font:700 .64rem/1.2 var(--tp3-sans)}
.tp40-ship svg{width:100%;height:30px;overflow:visible}
.tp40-ship .arc{fill:none;stroke:#f0c063;stroke-width:1.5;stroke-dasharray:4 4;animation:tp40-dash 1.2s linear infinite}
.tp40-ship .dot{fill:#fff}

/* 4. Workflow -------------------------------------------------------------- */
.tp40-flow{background:var(--tp3-ink);color:var(--tp3-on-dark)}
.tp40-flow .tp-eyebrow{color:#f0c063!important}
.tp-editorial .tp40-flow h2{color:#fff}
.tp40-flow .tp-lead{color:#cfdcd8}
/* Design journey */
.tp40-journey{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;margin-bottom:34px}
.tp40-journey-stage{position:relative;aspect-ratio:4/3;border-radius:20px;background:radial-gradient(120% 120% at 20% 0,#0a5b67,#071a1e);overflow:hidden;box-shadow:0 0 0 1px #ffffff14}
.tp40-jpage{position:absolute;left:31%;top:12%;width:38%;height:76%;border-radius:4px;background:#fffdf8;box-shadow:0 30px 50px -24px #000;transition:transform .8s var(--tp3-ease)}
.tp40-jpage>span{position:absolute;inset:0;transition:opacity .6s,transform .8s var(--tp3-ease)}
.tp40-jpage .files{opacity:0}
.tp40-jpage .f{position:absolute;display:grid;place-items:center;width:34%;height:22%;border-radius:6px;background:#fff;box-shadow:0 12px 22px -10px #0008;font:800 .62rem/1 var(--tp3-sans);font-style:normal;letter-spacing:.06em;color:#fff}
.tp40-jpage .f.doc{left:-44%;top:10%;background:#2b579a}.tp40-jpage .f.img{right:-44%;top:34%;background:#1f7a4d}.tp40-jpage .f.logo{left:-38%;bottom:12%;background:#c2187f}
[data-stage="0"] .tp40-jpage .files{opacity:1}
[data-stage="0"] .tp40-jpage .f{animation:tp40-float 3s ease-in-out infinite alternate}
[data-stage="0"] .tp40-jpage .f.img{animation-delay:-1s}[data-stage="0"] .tp40-jpage .f.logo{animation-delay:-2s}
@keyframes tp40-float{to{transform:translateY(-8px) rotate(-3deg)}}
.tp40-jpage .lay i{position:absolute;border-radius:2px;background:#d9d2c2;transition:all .8s var(--tp3-ease)}
.tp40-jpage .lay .hd{left:10%;top:8%;width:80%;height:9%;background:#04424c}
.tp40-jpage .lay .im{left:10%;top:21%;width:80%;height:30%;background:linear-gradient(135deg,#0a8fc4,#c2187f)}
.tp40-jpage .lay .c1{left:10%;top:56%;width:37%;height:34%;background:repeating-linear-gradient(#cfd6d8 0 3px,transparent 3px 8px)}
.tp40-jpage .lay .c2{left:53%;top:56%;width:37%;height:34%;background:repeating-linear-gradient(#cfd6d8 0 3px,transparent 3px 8px)}
.tp40-jpage .lay .c3{left:10%;top:93%;width:20%;height:2%;background:#e0b04a}
[data-stage="0"] .tp40-jpage .lay i{opacity:0;transform:translateY(20px)}
[data-stage="1"] .tp40-jpage .lay i:nth-child(2){transition-delay:.15s}[data-stage="1"] .tp40-jpage .lay i:nth-child(3){transition-delay:.3s}[data-stage="1"] .tp40-jpage .lay i:nth-child(4){transition-delay:.45s}
.tp40-jpage .marks{opacity:0}
.tp40-jpage .marks .m1{position:absolute;left:6%;top:6%;width:86%;height:13%;border:2px solid #c2187f;border-radius:40%;transform:rotate(-2deg)}
.tp40-jpage .marks .m2{position:absolute;left:52%;top:70%;width:40%;height:3px;background:#c2187f;transform:rotate(-3deg)}
.tp40-jpage .marks em{position:absolute;right:-48%;top:2%;padding:6px 8px;border-radius:8px;background:#c2187f;color:#fff;font:700 .6rem/1.2 var(--tp3-sans);font-style:normal;white-space:nowrap}
[data-stage="2"] .tp40-jpage .marks{opacity:1}
.tp40-jpage .ok{position:absolute;left:50%;top:50%;padding:8px 14px;border:3px solid #1f7a4d;border-radius:6px;font:800 .9rem/1 var(--tp3-sans);letter-spacing:.18em;text-transform:uppercase;color:#1f7a4d;background:#ffffffd9;opacity:0;transform:translate(-50%,-50%) rotate(-10deg) scale(1.8);transition:opacity .4s,transform .5s cubic-bezier(.2,1.6,.4,1)}
[data-stage="3"] .tp40-jpage .ok{opacity:1;transform:translate(-50%,-50%) rotate(-10deg) scale(1)}
[data-stage="3"] .tp40-jpage{transform:translateX(-30%) scale(.86)}
.tp40-jprint{position:absolute;right:8%;bottom:14%;width:24%;height:44%;opacity:0;transform:translateX(30px);transition:opacity .6s .4s,transform .8s .4s var(--tp3-ease)}
.tp40-jprint i{position:absolute;left:0;right:0;height:72%;border-radius:3px;background:#fffdf8;box-shadow:0 10px 20px -10px #000}
.tp40-jprint i:nth-child(1){bottom:0}.tp40-jprint i:nth-child(2){bottom:6%;transform:rotate(-3deg)}.tp40-jprint i:nth-child(3){bottom:12%;transform:rotate(2deg);background:linear-gradient(#04424c 0 18%,#fffdf8 18%)}
.tp40-jprint b{position:absolute;left:-10%;right:-10%;bottom:-24%;font:700 .6rem/1.2 var(--tp3-sans);color:#f0c063;text-align:center}
[data-stage="3"] .tp40-jprint{opacity:1;transform:none}
.tp40-jsteps{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.tp40-jsteps button{position:relative;display:grid;grid-template-columns:42px 1fr;gap:2px 10px;width:100%;padding:16px 18px 18px;border:1px solid #ffffff1f;border-radius:14px;background:#ffffff08;color:#fff;text-align:left;cursor:pointer;transition:background .4s,border-color .4s}
.tp40-jsteps .n{grid-row:span 2;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#ffffff14;font:700 .76rem/1 var(--tp3-sans);color:#f0c063;transition:background .4s,color .4s}
.tp40-jsteps strong{font:500 1.25rem/1.2 var(--tp3-serif)}
.tp40-jsteps .d{font-size:.86rem;line-height:1.5;color:#cfdcd8;max-height:0;overflow:hidden;opacity:0;transition:max-height .6s var(--tp3-ease),opacity .4s}
.tp40-jsteps .is-active button{background:#ffffff14;border-color:#f0c06366}
.tp40-jsteps .is-active .n{background:var(--tp3-gold-soft);color:#0b2328}
.tp40-jsteps .is-active .d{max-height:120px;opacity:1}
.tp40-jsteps .bar{position:absolute;left:18px;right:18px;bottom:0;height:2px;overflow:hidden;opacity:0}
.tp40-jsteps .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--tp3-cyan),var(--tp3-magenta),var(--tp3-yellow));transform:scaleX(0);transform-origin:0 50%}
.tp40-journey.is-playing .is-active .bar{opacity:1}
.tp40-journey.is-playing .is-active .bar i{animation:tp40-fill 4.6s linear forwards}
@keyframes tp40-fill{to{transform:scaleX(1)}}
/* Promo steps */
.tp40-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px);margin:0 0 34px;padding:0;list-style:none}
.tp40-step{overflow:hidden;border-radius:18px;background:#12353b;box-shadow:0 0 0 1px #ffffff14}
.tp40-step figure{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden;background:#0b2328}
.tp40-step figure>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tp40-step-body{padding:20px 22px 24px}
.tp40-step-n{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--tp3-gold-soft);color:#0b2328;font:700 .8rem/1 var(--tp3-sans)}
.tp-editorial .tp40-step h3{margin:12px 0 8px;font:500 1.55rem/1.1 var(--tp3-serif);color:#fff}
.tp40-step p{margin:0;color:#cfdcd8;line-height:1.6}
.tp40-kit{position:absolute;inset:0;display:grid;grid-template-columns:auto auto 1fr;align-items:center;justify-items:center;gap:10px;padding:18px;background:radial-gradient(120% 120% at 0 0,#0a5b67,#071a1e)}
.tp40-kit .logo{grid-row:1;display:grid;place-items:center;width:62px;height:62px;border-radius:50%;border:2px dashed #fff;color:#fff;font:800 .6rem/1 var(--tp3-sans);letter-spacing:.08em}
.tp40-kit .sw{display:none}
.tp40-kit .arrow{font:700 1.6rem/1 var(--tp3-sans);color:#f0c063;animation:tp40-nudge 1.4s ease-in-out infinite alternate}
@keyframes tp40-nudge{to{transform:translateX(8px)}}
.tp40-kit .prod{position:relative;width:min(120px,90%);aspect-ratio:1;border-radius:12px 12px 26px 26px;background:linear-gradient(160deg,#fffdf8,#e7e0cf);box-shadow:0 20px 30px -16px #000}
.tp40-kit .zone{position:absolute;left:24%;top:26%;width:52%;height:34%;border:1.5px dashed #c2187f;border-radius:4px;background:repeating-linear-gradient(45deg,#c2187f14 0 6px,transparent 6px 12px)}
.tp40-kit em{grid-column:1 / -1;font:700 .64rem/1 var(--tp3-sans);font-style:normal;letter-spacing:.14em;text-transform:uppercase;color:#cfdcd8}
.tp40-kit::after{content:'';position:absolute;left:18px;top:18px;display:block;width:78px;height:14px;background:linear-gradient(90deg,#0a8fc4 0 33%,#c2187f 0 66%,#e0b04a 0);border-radius:4px}
.tp40-ready{position:absolute;left:12px;right:12px;bottom:12px;z-index:3;padding:9px 12px;border-radius:10px;background:#1f7a4de6;color:#fff;font:700 .74rem/1.2 var(--tp3-sans)}
/* File tray */
.tp40-tray{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(24px,3vw,38px);border-radius:20px;background:#fffdf5;color:var(--tp3-text);box-shadow:0 40px 80px -40px #000}
.tp40-tray .tp-eyebrow{color:#8a6a2c!important}
.tp-editorial .tp40-tray h3{margin:6px 0 10px;font:500 clamp(1.7rem,2.6vw,2.3rem)/1.05 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-tray p{margin:0 0 12px;color:var(--tp3-muted);line-height:1.6;font-size:.94rem}
.tp40-tray .tp-button{border-radius:99px}
.tp40-tray-note{font-size:.84rem!important}
.tp40-folder{position:relative;padding:22px 18px 18px;border-radius:14px;background:linear-gradient(#e9c577,#d7ab4f);box-shadow:inset 0 2px 0 #ffffff66}
.tp40-folder-back{position:absolute;left:14px;top:-12px;width:38%;height:22px;border-radius:10px 10px 0 0;background:#d7ab4f}
.tp40-files{position:relative;z-index:1;display:grid;gap:8px;margin:0;padding:0;list-style:none}
.tp40-files li{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;background:#fffdf8;box-shadow:0 8px 16px -10px #0006}
.tp40-files .ext{padding:5px 7px;border-radius:5px;background:var(--tp3-ink);color:#fff;font:800 .56rem/1 var(--tp3-sans);letter-spacing:.08em;white-space:nowrap}
.tp40-files li:nth-child(2) .ext{background:#2b579a}.tp40-files li:nth-child(3) .ext{background:#1f7a4d}.tp40-files li:nth-child(4) .ext{background:#c2187f}.tp40-files li:nth-child(5) .ext{background:#8a6a2c}
.tp40-files .t{font:600 .88rem/1.35 var(--tp3-sans);color:var(--tp3-ink)}
.tp40-folder-front{display:block;margin-top:12px;font:700 .64rem/1 var(--tp3-sans);letter-spacing:.16em;text-transform:uppercase;color:#5a4410}
.tp40-js .tp40-files li{opacity:0;transform:translateY(-40px) rotate(-3deg)}
.tp40-js .tp40-tray.is-in .tp40-files li{animation:tp40-drop .7s calc(.3s + var(--k) * .18s) cubic-bezier(.2,1.3,.4,1) forwards}
@keyframes tp40-drop{to{opacity:1;transform:none}}

/* 5. General Supplies ------------------------------------------------------ */
.tp40-sheet{position:relative;padding:28px 28px 22px;border-top:0;border-radius:4px;background:#fff repeating-linear-gradient(transparent 0 35px,#e7eef0 35px 36px);box-shadow:0 30px 60px -30px #0b232880,0 0 0 1px #0b23281a}
.tp40-sheet::before{content:'';position:absolute;left:50%;top:-14px;width:90px;height:26px;margin-left:-45px;border-radius:6px;background:linear-gradient(#b9c2c4,#8f9a9c);box-shadow:0 4px 8px -4px #0006}
.tp40-sheet-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px}
.tp40-sheet-head h3{margin:0}
.tp40-sheet-head span{font:700 .58rem/1 var(--tp3-sans);letter-spacing:.16em;text-transform:uppercase;color:#8a6a2c}
.tp40-sheet ul{display:grid;gap:0;margin:8px 0 10px;padding:0;list-style:none}
.tp40-sheet li{display:grid;grid-template-columns:22px 1fr;gap:2px 10px;margin:0;padding:9px 0;border-bottom:1px dashed #d8d1bf;font-size:.9rem}
.tp40-sheet li::before{content:'';grid-row:span 2;width:16px;height:16px;margin-top:2px;border-radius:4px;border:1.5px solid #9fb3b0;background:#fff center/10px no-repeat}
.tp40-sheet .q{color:var(--tp3-ink);font-weight:600}
.tp40-sheet .a{font:italic 400 .98rem/1.3 'Caveat','Segoe Script','Bradley Hand',cursive;color:#2b579a}
.tp40-js .tp40-sheet .a{clip-path:inset(0 100% 0 0)}
.tp40-js .tp40-sheet.is-in .a{animation:tp40-write .9s calc(.5s + var(--k) * .45s) steps(18) forwards}
@keyframes tp40-write{to{clip-path:inset(0 0 0 0)}}
.tp40-sheet.is-in li::before,html:not(.tp40-js) .tp40-sheet li::before{border-color:#1f7a4d;background-color:#1f7a4d;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.5 3.5L11 1' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E");transition:background-color .3s calc(.9s + var(--k,0) * .45s),border-color .3s calc(.9s + var(--k,0) * .45s)}
.tp40-sheet li:nth-child(1){--k:0}.tp40-sheet li:nth-child(2){--k:1}.tp40-sheet li:nth-child(3){--k:2}.tp40-sheet li:nth-child(4){--k:3}.tp40-sheet li:nth-child(5){--k:4}
.tp40-sheet-ex{margin:0 0 8px!important;font:600 .66rem/1 var(--tp3-sans)!important;letter-spacing:.1em;text-transform:uppercase;color:#8b9a98!important}
.tp31-typical-grid>.tp40-typical-fig{grid-column:1 / -1}
.tp40-typical-fig{position:relative;margin:0;aspect-ratio:24/8;overflow:hidden;border-radius:16px;background:var(--tp3-ink);box-shadow:var(--tp3-shadow-2)}
.tp40-typical-fig figcaption{position:absolute;left:12px;bottom:12px;z-index:3;padding:7px 11px;border-radius:99px;background:#fffdf8e6;font:600 .74rem/1.2 var(--tp3-sans);color:var(--tp3-ink)}
.tp-supply-steps.tp40-supply-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);margin-top:26px;padding:0;list-style:none}
.tp40-supply-steps .tp40-sstep{padding:0;border:0;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--tp3-line);transition:transform .6s var(--tp3-ease),box-shadow .6s}
.tp40-supply-steps .tp40-sstep:hover{transform:translateY(-6px);box-shadow:var(--tp3-shadow-2)}
.tp40-sstep figure{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--tp3-ink)}
.tp40-sstep figure>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tp40-sstep-n{position:absolute;right:12px;bottom:12px;z-index:3;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--tp3-gold-soft);color:#0b2328;font:700 .82rem/1 var(--tp3-sans);box-shadow:0 8px 16px -8px #000}
.tp40-sstep>div{padding:18px 20px 22px}
.tp-editorial .tp40-sstep h3{margin:0 0 8px;font:500 1.45rem/1.1 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-sstep p{margin:0 0 8px;font-size:.9rem;line-height:1.55;color:var(--tp3-muted)}
.tp40-sstep .tp40-sstep-more{padding-top:8px;border-top:1px dashed var(--tp3-line);color:var(--tp3-text);font-weight:600}
.tp40-proc{background:linear-gradient(180deg,#fffdf8,var(--tp3-cream))}
.tp40-proc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,26px)}
.tp40-proc-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:26px 24px 24px;border:1px solid var(--tp3-line);border-radius:18px;background:#fff;color:inherit!important;text-decoration:none!important;transition:transform .6s var(--tp3-ease),box-shadow .6s,border-color .4s}
.tp40-proc-card:hover{transform:translateY(-6px);box-shadow:var(--tp3-shadow-2);border-color:var(--tp3-gold)}
.tp40-doc{position:relative;width:74px;height:92px;margin-bottom:10px;padding:14px 10px;border-radius:4px;background:#fffdf8;box-shadow:0 14px 24px -14px #0b2328aa,0 0 0 1px #0b23281a;display:flex;flex-direction:column;gap:6px}
.tp40-doc i{display:block;height:4px;border-radius:2px;background:#d9d2c2}.tp40-doc i:first-child{height:8px;width:70%;background:var(--tp3-teal)}
.tp40-doc b{position:absolute;right:-12px;bottom:-8px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#1f7a4d;color:#fff;box-shadow:0 8px 14px -8px #000}
.tp40-doc b::after{content:'✓';font:700 1rem/1 var(--tp3-sans)}
.is-quote .tp40-doc b{background:var(--tp3-gold-soft);color:#0b2328}.is-quote .tp40-doc b::after{content:'Rs';font-size:.72rem}
.is-refs .tp40-doc b{background:var(--tp3-magenta)}.is-refs .tp40-doc b::after{content:'★';font-size:.9rem}
.tp40-proc-card:hover .tp40-doc{transform:rotate(-4deg);transition:transform .5s var(--tp3-ease)}
.tp40-proc-card strong{font:500 1.5rem/1.1 var(--tp3-serif);color:var(--tp3-ink)}
.tp40-proc-card .d{font-size:.92rem;line-height:1.6;color:var(--tp3-muted)}
.tp40-proc-card .l{margin-top:auto;padding-top:8px;font:700 .8rem/1 var(--tp3-sans);color:var(--tp3-teal-2)}

/* Responsive --------------------------------------------------------------- */
@media(max-width:1100px){
  .tp-supply-steps.tp40-supply-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp40-detail-grid,.tp40-points{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tp40-journey{grid-template-columns:1fr}
}
@media(max-width:860px){.tp40-typical-fig{aspect-ratio:16/9}}
@media(max-width:900px){
  .tp40-ba-grid,.tp40-steps,.tp40-proc-grid{grid-template-columns:1fr}
  .tp40-tray{grid-template-columns:1fr}
}
@media(max-width:640px){
  .tp40-detail-grid,.tp40-points,.tp-supply-steps.tp40-supply-steps{grid-template-columns:1fr}
  .tp40-raw .logo{width:48px;height:48px;font-size:.5rem}
  .tp40-raw.is-brief .logo{width:60px;height:60px}
  .tp40-fork{grid-template-columns:1fr .7fr 1fr;padding:14px 10px}
  .tp40-fork span{font-size:.64rem;padding:8px}
  .tp40-loop{font-size:.58rem;padding:6px}
  .tp40-sheet{padding:24px 18px 18px}
}
@media(prefers-reduced-motion:reduce){
  .tp40-fork path,.tp40-ship .arc,.tp40-kit .arrow,[data-stage] .tp40-jpage .f,.is-in .tp40-loop span{animation:none!important}
  .tp40-js [data-tp40-reveal],.tp40-js .tp40-chips li,.tp40-js .tp40-files li{opacity:1;transform:none}
  .tp40-js .tp40-cover,.tp40-js .tp40-spine,.tp40-js .tp40-sheet .a{clip-path:none}
}