:root {
  font-family: Arial, Helvetica, sans-serif;
  color: #171722; background: #fcfaf7;
  font-synthesis: none; text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  --blue: #4945ff; --lime: #d3fc08; --paper: #fcfaf7; --ink-muted: #3c3a50;
}
* { box-sizing: border-box; min-width: 0; }
body { margin: 0; }
img, svg { max-width: 100%; }
svg { display: block; }
p { margin: 0; }
.printically-page-shell {
  width: 100%; max-width: 1680px; min-height: 100svh; margin-inline: auto;
  padding: clamp(26px, 2.6vw, 40px) clamp(24px, 5.2vw, 88px) 24px;
  display: flex; flex-direction: column;
}
.masthead, .footer, .footer-identity, .made-in, .launch-status { display: flex; align-items: center; }
.masthead, .footer { justify-content: space-between; gap: 24px; }
.wordmark { color: var(--blue); font-size: clamp(36px, 3.9vw, 56px); font-weight: 800; line-height: 1; letter-spacing: -.065em; }
.trademark { display: inline-block; margin-left: 5px; font-size: .25em; line-height: 1.5; letter-spacing: -.01em; vertical-align: top; }
.launch-status { gap: 12px; font-size: clamp(14px, 1.55vw, 21px); font-weight: 600; }
.status-dot { width: 13px; height: 13px; flex: none; border-radius: 50%; background: var(--blue); animation: status-pulse 1.6s ease-in-out 2; }
.printically-responsive-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); }
.hero { flex: 1; align-items: center; gap: clamp(24px, 3vw, 48px); padding-block: clamp(24px, 3vh, 40px) clamp(44px, 7vh, 80px); }
.intro { position: relative; z-index: 2; padding-bottom: 8px; }
.eyebrow { margin-bottom: clamp(28px, 3vw, 42px); font-size: clamp(12px, 1.2vw, 18px); font-weight: 700; line-height: 1.5; letter-spacing: .17em; text-transform: uppercase; animation: entrance 700ms ease-out both; }
h1 { margin: 0; font-size: clamp(54px, 6.1vw, 96px); font-weight: 700; letter-spacing: -.068em; line-height: 1.01; animation: entrance 800ms 70ms ease-out both; }
.headline-line { display: block; }
.highlight { position: relative; display: inline-block; color: var(--blue); white-space: nowrap; }
.underline { position: absolute; right: 1%; bottom: -.23em; width: 76%; height: .29em; overflow: visible; stroke: var(--lime); stroke-width: 6; stroke-linecap: round; }
.description { max-width: 560px; margin-top: clamp(33px, 3.6vw, 49px); color: var(--ink-muted); font-size: clamp(17px, 1.65vw, 24px); line-height: 1.45; letter-spacing: -.015em; text-wrap: balance; animation: entrance 800ms 140ms ease-out both; }
.coming-soon { width: fit-content; max-width: 100%; display: flex; align-items: center; gap: 13px; margin-top: clamp(28px, 3vw, 40px); padding: 13px 25px 13px 20px; border-radius: 100px; background: var(--lime); font-size: clamp(12px, 1.13vw, 16px); font-weight: 700; line-height: 1.3; letter-spacing: .17em; text-transform: uppercase; animation: entrance 800ms 210ms ease-out both; }
.coming-soon svg { width: 28px; height: 28px; flex: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.coming-soon > span { white-space: nowrap; }
.status-dash { margin-inline: 2px; }
.art { position: relative; width: 100%; aspect-ratio: 1; justify-self: end; isolation: isolate; overflow: clip; }
.art-grid { position: absolute; inset: -8% 0 -8% -5%; z-index: -2; background-image: linear-gradient(#8d82b60c 1px, transparent 1px), linear-gradient(90deg, #8d82b60c 1px, transparent 1px); background-size: 64px 64px; -webkit-mask-image: radial-gradient(ellipse at 56% 48%, #000 30%, transparent 72%); mask-image: radial-gradient(ellipse at 56% 48%, #000 30%, transparent 72%); }
.halo { position: absolute; z-index: -1; top: 6%; left: 11%; width: 72%; aspect-ratio: 1; border-radius: 50%; background: #eee7ff; opacity: .65; }
.symbol-stage { position: absolute; inset: 0; transform: rotate(-10deg); animation: symbol-arrival 4.2s ease-out both; }
.printically-media-contain { display: block; width: 100%; height: auto; object-fit: contain; }
.selection-box { position: absolute; inset: 17.1% 6.8% 17.2% 6.6%; border: 1px dashed var(--blue); }
.anchor { position: absolute; width: 9px; height: 9px; border: 2px solid var(--blue); background: var(--paper); }
.anchor-nw { top: -5px; left: -5px; }.anchor-n { top: -5px; left: calc(50% - 4px); }.anchor-ne { top: -5px; right: -5px; }
.anchor-w { top: calc(50% - 4px); left: -5px; }.anchor-e { top: calc(50% - 4px); right: -5px; }
.anchor-sw { bottom: -5px; left: -5px; }.anchor-s { bottom: -5px; left: calc(50% - 4px); }.anchor-se { bottom: -5px; right: -5px; }
.graphic-glyphs { position: absolute; top: 28%; left: 0; width: 43px; display: grid; gap: 10px; color: var(--blue); animation: entrance 900ms 160ms ease-out both; }
.graphic-glyphs svg { width: 40px; height: 40px; stroke: currentColor; stroke-width: 1.7; }
.pointer-glyph { border-radius: 11px; background: var(--blue); color: var(--paper); }
.type-glyph { text-align: center; font-family: Georgia, serif; font-size: 35px; line-height: 40px; }
.lime-seal { position: absolute; right: 0; bottom: 10%; z-index: 2; width: 27%; aspect-ratio: 1; display: grid; place-items: center; border-radius: 50%; background: var(--lime); animation: seal-arrival 1.2s 180ms ease-out both; }
.lime-seal svg { width: 72%; height: 72%; stroke: var(--blue); stroke-width: 2.4; }
.canvas-pointer { position: absolute; right: 0; top: 58%; z-index: 3; width: 36px; height: 43px; fill: #171722; stroke: var(--paper); stroke-width: 2.5; stroke-linejoin: round; }
.pixel-fragment { position: absolute; width: 32%; height: auto; left: 2%; bottom: 8%; color: #b8afd51a; z-index: -1; }
.layer-glyph { position: absolute; left: 7%; bottom: 9%; width: 59px; height: 59px; display: grid; place-items: center; background: #fff; border: 1px solid #efebf3; border-radius: 17px; transform: rotate(7deg); }
.layer-glyph svg { width: 37px; height: 37px; overflow: visible; stroke: var(--blue); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.drafting-line { position: absolute; inset: 0; width: 100%; height: 100%; stroke: #474160; stroke-width: 1.3; stroke-dasharray: 4 6; }
.drafting-line .arrow-tip { stroke-dasharray: none; }
.registration { position: absolute; width: 25px; height: 25px; color: #a19ab5; }
.registration::before, .registration::after { content: ""; position: absolute; background: currentColor; }
.registration::before { width: 1px; height: 100%; left: 50%; }.registration::after { width: 100%; height: 1px; top: 50%; }
.registration-one { top: 3%; left: 2%; }.registration-two { bottom: 1%; left: 47%; }
.crop-mark { position: absolute; right: 0; width: 23px; height: 23px; border-right: 1px solid #a19ab5; }
.crop-top { top: 5%; border-top: 1px solid #a19ab5; }.crop-bottom { bottom: 2%; border-bottom: 1px solid #a19ab5; }
.art-coordinate { position: absolute; left: 10%; top: 1%; color: #777087; font: 9px/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.footer { position: relative; padding-top: 22px; border-top: 1px solid #d9d3e4; color: var(--ink-muted); font-size: 15px; line-height: 1.5; }
.footer-identity { flex-wrap: wrap; gap: 20px; }.footer-divider { width: 1px; height: 16px; background: #8b849c; }
.made-in { gap: 20px; white-space: nowrap; }.italy-mark { display: inline-grid; grid-template-columns: repeat(3, 1fr); width: 30px; height: 19px; transform: skew(-12deg); }
.italy-mark i:nth-child(1) { background: #008d49; }.italy-mark i:nth-child(2) { background: #fff; }.italy-mark i:nth-child(3) { background: #e22e3a; }
@keyframes entrance { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes symbol-arrival { from { transform: translateY(14px) rotate(-7deg); } to { transform: translateY(0) rotate(-10deg); } }
@keyframes seal-arrival { from { opacity: 0; transform: scale(.94) rotate(-14deg); } to { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes status-pulse { 50% { opacity: .45; } }
@media (min-width: 861px) and (max-height: 780px) {
  .hero { padding-block: 32px; }h1 { font-size: clamp(54px, 5.8vw, 86px); }.art { width: min(100%, 65svh); }
  .eyebrow { margin-bottom: 28px; }.description { margin-top: 32px; }.coming-soon { margin-top: 28px; }
}
@media (max-width: 860px) {
  .printically-page-shell { padding-top: 28px; }.hero { grid-template-columns: minmax(0, 1fr); gap: 24px; padding-block: 62px 38px; }
  .intro { max-width: 680px; }.eyebrow { margin-bottom: 28px; font-size: 12px; }h1 { font-size: clamp(54px, 8.5vw, 76px); }
  .description { max-width: 560px; margin-top: 35px; font-size: 20px; }.coming-soon { margin-top: 30px; font-size: 13px; }
  .art { width: min(100%, 530px); justify-self: center; }.graphic-glyphs { left: 0; }.canvas-pointer { right: 0; }.footer { font-size: 12px; }
}
@media (max-width: 540px) {
  .masthead { gap: 16px; }.wordmark { font-size: 32px; }.launch-status { gap: 7px; font-size: 12px; }.status-dot { width: 8px; height: 8px; }
  .hero { gap: 28px; padding-block: 54px 28px; }.eyebrow { font-size: 10px; letter-spacing: .15em; margin-bottom: 24px; }
  h1 { font-size: clamp(37px, 11.8vw, 63px); letter-spacing: -.065em; }.description { font-size: 17px; line-height: 1.5; margin-top: 32px; }
  .coming-soon { gap: 9px; padding: 11px 17px 11px 13px; margin-top: 27px; font-size: 11px; letter-spacing: .14em; }.coming-soon svg { width: 25px; height: 25px; }
  .art { margin-top: 4px; }.symbol-stage { inset: auto; top: 3%; left: 8%; width: 92%; aspect-ratio: 1; }.graphic-glyphs { top: 27%; width: 28px; gap: 5px; }.graphic-glyphs svg { width: 27px; height: 27px; }.pointer-glyph { border-radius: 8px; }.type-glyph { font-size: 24px; line-height: 27px; }
  .anchor { width: 7px; height: 7px; border-width: 1.5px; }.layer-glyph { width: 43px; height: 43px; border-radius: 13px; }.layer-glyph svg { width: 28px; height: 28px; }.canvas-pointer { width: 25px; height: 30px; }
  .registration { width: 18px; height: 18px; }.crop-mark { width: 18px; height: 18px; }.art-coordinate { font-size: 7px; }
  .footer { flex-wrap: wrap; gap: 16px; padding-top: 18px; }.footer-identity { gap: 13px; font-size: 11px; }.footer-divider { height: 13px; }.made-in { margin-left: auto; gap: 12px; font-size: 11px; }.italy-mark { width: 25px; height: 16px; }
}
@media (max-width: 359px) { .printically-page-shell { padding-inline: 20px; }.wordmark { font-size: 28px; }.launch-status { font-size: 11px; gap: 6px; }.status-dot { width: 7px; height: 7px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }