/* Torqevixamona Blueprint Lab — progressive enhancements; no layout redesign */
/* Shared hover / focus polish: all pages get this via @import in style.css. */
.desktop-nav a, .footer-links a, .course-row, .practice-tile, .path-tile,
.benefit, .product-card, .socials a {transition: color .22s ease, border-color .22s ease, background-color .22s ease, box-shadow .26s ease, transform .26s ease;}
.desktop-nav a{position:relative;}
.desktop-nav a::after{content:"";height:1px;position:absolute;bottom:-4px;left:0;right:100%;background:var(--rust);transition:right .24s ease;}
.desktop-nav a:hover::after,.desktop-nav a:focus-visible::after{right:0;}
.product-card:hover,.product-card:focus-within{transform:translateY(-5px);}
.product-card:hover .cover-frame,.product-card:focus-within .cover-frame{border-color:var(--blue);box-shadow:0 12px 28px rgba(16,44,58,.12);}
.product-card:hover .cover-frame img,.product-card:focus-within .cover-frame img{transform:scale(1.033);}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 15px rgba(16,44,58,.15);}
.path-tile:hover,.practice-tile:hover,.benefit:hover{border-color:var(--blue);}
.faq-item summary{transition:background-color .2s ease,padding-left .2s ease;}
.faq-item summary:hover{background:rgba(68,110,130,.045);padding-left:10px;}
.footer-links a:hover,.footer-links a:focus-visible{color:#d6e5eb;}
a:focus-visible,button:focus-visible,textarea:focus-visible{outline:2px solid var(--rust);outline-offset:3px;}

/* Home: test yourself */
.torq-self-test{position:relative;}
.torq-self-test__heading{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:end;border-top:1px solid var(--line);padding-top:29px;margin-bottom:27px;}
.torq-self-test__heading h2{font-size:clamp(33px,4vw,52px);letter-spacing:-.045em;line-height:1.07;margin:0;}
.torq-self-test__heading h2 em,.torq-free-popup__panel h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--blue);}
.torq-self-test__heading>p{max-width:480px;color:#405d69;font-size:14px;margin:0;}
.torq-self-test__grid{display:grid;grid-template-columns:minmax(0, .88fr) minmax(0,1.12fr);border:1px solid var(--line);background:var(--white);}
.torq-self-test__question{padding:34px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;background:var(--deep-paper);border-right:1px solid var(--line);}
.torq-self-test__question h3{font-size:clamp(24px,2.5vw,34px);line-height:1.14;letter-spacing:-.035em;margin:10px 0 17px;}
.torq-self-test__question>p:not(.eyebrow){font-size:14px;line-height:1.65;}
.torq-self-test__footnote{font-size:12px!important;opacity:.75;margin-top:auto;padding-top:26px;}
.torq-self-test__score{border-top:1px solid var(--line);padding-top:15px;margin-top:15px;font:12px var(--mono)!important;}
.torq-self-test__workspace{padding:28px;min-width:0;}
.torq-self-test__workspace>label{display:block;font:11px var(--mono);letter-spacing:.08em;color:var(--blue);margin-bottom:11px;}
#torq-quiz-editor{display:block;width:100%;min-height:176px;border:1px solid var(--line);border-radius:0;background:#102c3a;color:#d9eef0;resize:vertical;padding:20px;font:14px/1.65 var(--mono);tab-size:2;}
#torq-quiz-editor::placeholder{color:#a8c0c8;}
.torq-self-test__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:13px;align-items:center;}
.torq-self-test__actions button{cursor:pointer;}
.torq-self-test__secondary,.torq-self-test__restart{font:12px var(--sans);padding:11px 12px;background:transparent;color:var(--ink);border:1px solid var(--line);transition:background-color .2s,border-color .2s;}
.torq-self-test__secondary:hover,.torq-self-test__restart:hover{background:var(--deep-paper);border-color:var(--blue);}
.torq-self-test__secondary:disabled,.torq-self-test__actions .btn:disabled{opacity:.4;cursor:not-allowed;}
.torq-self-test__feedback{min-height:27px;margin:15px 0 0;color:var(--blue);font-size:13px;}
.torq-self-test__feedback.is-right{color:#236854;}
.torq-self-test__feedback.is-review{color:#96502b;}
.torq-self-test__reference{overflow:auto;padding:16px;background:#ecf2f2;border:1px solid var(--line);font:13px/1.6 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;}
.torq-self-test__reference[hidden]{display:none;}
.torq-self-test__restart{margin-top:15px;}

/* Home: one-time popup after 30 seconds */
body.torq-popup-open{overflow:hidden;}
.torq-free-popup[hidden]{display:none!important;}
.torq-free-popup{position:fixed;inset:0;z-index:150;display:grid;place-items:center;padding:18px;}
.torq-free-popup__shade{position:absolute;inset:0;border:0;background:rgba(6,28,39,.73);cursor:pointer;}
.torq-free-popup__panel{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 165px;gap:25px;align-items:center;width:min(640px,100%);background:var(--paper);padding:36px;border:1px solid var(--line);box-shadow:0 22px 90px rgba(5,27,39,.27);}
.torq-free-popup__panel:focus{outline:none;}
.torq-free-popup__close{position:absolute;right:8px;top:6px;border:0;background:transparent;color:var(--ink);width:38px;height:38px;font-size:25px;cursor:pointer;}
.torq-free-popup__panel h2{font-size:clamp(31px,4vw,46px);line-height:1.12;letter-spacing:-.04em;margin:10px 0 15px;}
.torq-free-popup__copy>p:not(.eyebrow){font-size:14px;margin:0 0 23px;}
.torq-free-popup__panel>img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:contain;border:1px solid var(--line);box-shadow:6px 8px 0 rgba(68,110,130,.11);}
.torq-free-popup:not([hidden]) .torq-free-popup__panel{animation:torq-popup-in .3s ease-out both;}
@keyframes torq-popup-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:770px){
  .torq-self-test__heading,.torq-self-test__grid{grid-template-columns:1fr;}
  .torq-self-test__question{border-right:0;border-bottom:1px solid var(--line);padding:25px;}
  .torq-self-test__workspace{padding:22px;}
  .torq-self-test__heading{gap:15px;}
  .torq-free-popup__panel{grid-template-columns:minmax(0,1fr) 105px;gap:14px;padding:29px 18px 22px;}
  .torq-free-popup__panel h2{font-size:30px;}
}
@media(max-width:420px){
 .torq-free-popup__panel{grid-template-columns:1fr;max-height:calc(100dvh - 32px);overflow-y:auto;}
 .torq-free-popup__panel>img{display:none;}
 .torq-self-test__actions .btn{width:100%;}
}
@media(prefers-reduced-motion:reduce){
 .torq-free-popup__panel,.torq-free-popup:not([hidden]) .torq-free-popup__panel{animation:none!important;}
 .desktop-nav a,.desktop-nav a::after,.footer-links a,.course-row,.practice-tile,.path-tile,.benefit,.product-card,.socials a,
 .product-card .cover-frame img,.btn,.faq-item summary{transition:none!important;transform:none!important;}
}

/* FINAL TYPE + COMPOSITION POLISH — Blueprint Lab / Homepage */
/* Center section intros as one group, rather than splitting a title and note. */
#collection .section-head,
#learning-paths .section-head,
#practice .section-head {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;text-align:center;margin-inline:auto;margin-bottom:36px;
}
#collection .section-head>div,
#learning-paths .section-head>div,
#practice .section-head>div {width:100%;}
#collection .section-head .eyebrow,
#learning-paths .section-head .eyebrow,
#practice .section-head .eyebrow {margin-bottom:14px;}
#collection .section-head h2,
#learning-paths .section-head h2,
#practice .section-head h2 {margin-inline:auto;max-width:850px;line-height:1.09;}
#collection .section-head>p,
#learning-paths .section-head>p,
#practice .section-head>p {max-width:570px;margin:0 auto;text-align:center;line-height:1.55;}
/* Interactive study heading uses the same centered editorial hierarchy. */
.torq-self-test__heading {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:12px;text-align:center;padding-top:34px;margin-bottom:34px;
}
.torq-self-test__heading>div {max-width:850px;}
.torq-self-test__heading .eyebrow {margin-bottom:14px;}
.torq-self-test__heading h2 {font-size:clamp(34px,3.45vw,52px);line-height:1.09;}
.torq-self-test__heading>p {text-align:center;max-width:570px;margin:0 auto;line-height:1.55;}
/* Mission: reveal a real technical request/response blueprint in the left column. */
#mission .mission-grid {display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(35px,5.5vw,78px);align-items:center;}
#mission .mission-art {min-width:0;position:relative;overflow:hidden;background:var(--deep-paper);border:1px solid var(--line);}
#mission .mission-diagram {display:block;width:100%;height:auto;aspect-ratio:620/430;}
#mission .mission-art-label {border-top:1px solid var(--line);padding:12px 16px;color:var(--blue);font:10px/1.5 var(--mono);letter-spacing:.09em;text-align:center;}
#mission .mission-art-label span {color:var(--rust);margin:0 8px;}
#mission .mission-story {min-width:0;}
#mission .mission-story .eyebrow {margin-bottom:17px;}
#mission h2,#benefits h2 {font-size:clamp(34px,3.45vw,52px);line-height:1.09;letter-spacing:-.047em;max-width:730px;margin:0 0 22px;}
#mission .mission-copy {font-size:15px;line-height:1.7;max-width:555px;}
#mission .mission-copy p {margin:0 0 15px;}
#mission .mission-copy p:last-child {margin-bottom:0;}
/* One-shot trace animation, starts only when the scene enters view. */
.js-motion #mission .mission-art.in-view .mission-flow {stroke-dasharray:750;stroke-dashoffset:750;animation:torq-mission-trace 2.5s cubic-bezier(.22,.61,.36,1) .3s forwards;}
.js-motion #mission .mission-art.in-view .mission-route-nodes {animation:torq-mission-nodes 1.3s ease 1.5s both;}
.js-motion #mission .mission-art.in-view .mission-plate {animation:torq-mission-plate 1.2s ease both;}
@keyframes torq-mission-trace {to{stroke-dashoffset:0;}}
@keyframes torq-mission-nodes {from{opacity:.25;}to{opacity:1;}}
@keyframes torq-mission-plate {from{opacity:.45;transform:translateY(9px);}to{opacity:1;transform:none;}}
@media(max-width:770px){
  #mission .mission-grid {grid-template-columns:1fr;gap:26px;}
  #mission .mission-story {order:0;}
  #mission .mission-art {order:1;max-width:560px;width:100%;margin-inline:auto;}
  #mission h2,#benefits h2 {font-size:clamp(34px,6.3vw,44px);}
  #collection .section-head,#learning-paths .section-head,#practice .section-head {align-items:center;gap:11px;margin-bottom:27px;}
  .torq-self-test__heading {align-items:center;gap:11px;margin-bottom:27px;}
}
@media(prefers-reduced-motion:reduce){
  #mission .mission-flow,#mission .mission-route-nodes,#mission .mission-plate {animation:none!important;stroke-dasharray:none!important;stroke-dashoffset:0!important;opacity:1!important;transform:none!important;}
}
/* The base .section-head p rule caps the eyebrow at 300px. Release that cap to center the full label. */
#collection .section-head .eyebrow,
#learning-paths .section-head .eyebrow,
#practice .section-head .eyebrow {
  width:100%;max-width:none;text-align:center;
}
