/* Story-first (l1) landing: "받는 문서" section placed after .purpose. Scoped under #deliverables so l2 is unaffected.
   Uses only existing landing tokens (--ink --paper --lavender --violet --violet-dark --night --line). */
html[data-landing-variant="l1"] #deliverables{background:#fff;padding:84px 0 92px;border-top:1px solid var(--line)}
html[data-landing-variant="l1"] #deliverables .kicker{margin-bottom:18px}
html[data-landing-variant="l1"] #deliverables h2{font-size:var(--landing-type-display);line-height:1.52;margin:0 0 24px}
html[data-landing-variant="l1"] #deliverables .deliver-lead{margin:0;max-width:600px;color:#5d5661;font-size:var(--landing-type-body);line-height:2;word-break:keep-all;text-wrap:pretty}
html[data-landing-variant="l1"] #deliverables .deliver-lead strong{color:var(--ink)}

/* 2 documents */
html[data-landing-variant="l1"] #deliverables .deliver-docs{display:grid;gap:18px;margin:44px 0 0}
html[data-landing-variant="l1"] #deliverables .deliver-doc{background:var(--paper);border:1px solid #e6e0ec;border-radius:var(--radius);padding:24px 18px 26px;display:flex;flex-direction:column;box-shadow:0 7px 35px rgba(66,44,87,.045)}
html[data-landing-variant="l1"] #deliverables .deliver-doc .doc-type{color:var(--violet);font-size:var(--landing-type-caption);font-weight:790;line-height:1.6;margin:0 0 6px}
html[data-landing-variant="l1"] #deliverables .deliver-doc h3{font-size:var(--landing-type-subheading);line-height:1.45;margin:0 0 10px}
html[data-landing-variant="l1"] #deliverables .deliver-doc .doc-desc{margin:0 0 16px;color:#655f69;font-size:15px;line-height:1.85;word-break:keep-all;text-wrap:pretty}
html[data-landing-variant="l1"] #deliverables .deliver-doc .doc-pages{align-self:flex-start;margin:0 0 22px;padding:3px 12px;border-radius:99px;background:var(--lavender);color:var(--violet-dark);font-size:var(--landing-type-caption);font-weight:720;line-height:1.7}
html[data-landing-variant="l1"] #deliverables .deliver-doc figure{margin:0}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;padding:4px 0 6px}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair img,
html[data-landing-variant="l1"] #deliverables .deliver-doc .solo img{border:1px solid #e3dde9;border-radius:6px;background:#fff;box-shadow:0 10px 28px rgba(25,21,32,.1)}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair a:first-child{grid-column:1 / 9;grid-row:1}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair a:last-child{grid-column:5 / 13;grid-row:1;margin-top:34px;z-index:1}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair a:last-child img{box-shadow:0 14px 34px rgba(25,21,32,.16)}
html[data-landing-variant="l1"] #deliverables .deliver-doc .solo{padding:4px 0 6px;display:grid;grid-template-columns:repeat(12,minmax(0,1fr))}
html[data-landing-variant="l1"] #deliverables .deliver-doc .solo a{grid-column:3 / 11}
html[data-landing-variant="l1"] #deliverables .deliver-doc figcaption{margin-top:20px;font-size:var(--landing-type-caption);line-height:1.7;color:#7b7480;letter-spacing:-.015em;text-align:left}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair+figcaption{margin-top:18px}
html[data-landing-variant="l1"] #deliverables .deliver-note{margin:20px 2px 0;font-size:var(--landing-type-caption);line-height:1.9;color:#777079}
html[data-landing-variant="l1"] #deliverables .deliver-note strong{color:#5d5661}
html[data-landing-variant="l1"] #deliverables .deliver-note a{color:var(--violet);font-weight:700;text-underline-offset:5px;white-space:nowrap}

/* Preview images open the sample PDF; the badge says so. Always visible on touch, on hover/focus for pointer devices. */
html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb{position:relative;display:block;cursor:pointer;border-radius:6px;color:inherit;text-decoration:none}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb img{display:block;width:100%;height:auto}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb:after{content:'PDF 전체 보기';position:absolute;right:8px;bottom:8px;padding:5px 10px;border-radius:99px;background:var(--violet-dark);color:#fff;font-size:var(--landing-type-caption);font-weight:740;line-height:1.5;letter-spacing:-.02em;white-space:nowrap;box-shadow:0 3px 10px rgba(25,21,32,.28);pointer-events:none;transition:opacity .15s ease}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pair a:first-child:after{right:auto;left:8px}
html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb:focus-visible{outline:3px solid #b8a1f9;outline-offset:3px}
@media(hover:hover) and (min-width:900px){
  html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb:after{opacity:0}
  html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb:hover:after,html[data-landing-variant="l1"] #deliverables .deliver-doc .pdf-thumb:focus-visible:after{opacity:1}
}

/* Large, easy-to-press PDF button under each document (secondary style: outline, so the paid CTA stays the main action). */
html[data-landing-variant="l1"] #deliverables .deliver-doc .btn--secondary{margin-top:22px;width:100%;min-height:52px;box-sizing:border-box;background:#fff;color:var(--violet-dark);border:1.5px solid var(--violet);box-shadow:none;font-weight:760}
html[data-landing-variant="l1"] #deliverables .deliver-doc .btn--secondary:hover{background:var(--lavender);color:var(--violet-dark);transform:none}
html[data-landing-variant="l1"] #deliverables .deliver-doc .btn--secondary:focus-visible{outline:3px solid #b8a1f9;outline-offset:3px}
html[data-landing-variant="l1"] #deliverables .deliver-doc .btn--secondary .arrow{font-size:var(--landing-type-lead);line-height:1}

/* what is inside */
html[data-landing-variant="l1"] #deliverables .deliver-inside{list-style:none;margin:52px 0 0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
html[data-landing-variant="l1"] #deliverables .deliver-inside li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding:22px 0;border-bottom:1px solid var(--line);margin:0}
html[data-landing-variant="l1"] #deliverables .deliver-inside .no{width:34px;height:34px;border-radius:10px;background:var(--lavender);color:var(--violet-dark);display:grid;place-items:center;font-size:15px;font-weight:800;line-height:1}
html[data-landing-variant="l1"] #deliverables .deliver-inside strong{display:block;font-size:var(--landing-type-lead);line-height:1.5;margin-bottom:4px}
html[data-landing-variant="l1"] #deliverables .deliver-inside span{display:block;color:#655f69;font-size:15px;line-height:1.85;word-break:keep-all;text-wrap:pretty}

/* price + CTA */
html[data-landing-variant="l1"] #deliverables .deliver-offer{margin:48px 0 0;padding:32px 24px 30px;border-radius:20px;background:var(--night);color:#f9f7fc;position:relative;overflow:hidden}
html[data-landing-variant="l1"] #deliverables .deliver-offer:after{content:'';position:absolute;right:-120px;top:-120px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(187,165,206,.14),transparent 66%);pointer-events:none}
html[data-landing-variant="l1"] #deliverables .deliver-offer>*{position:relative;z-index:1}
html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-cta{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:0}
html[data-landing-variant="l1"] #deliverables .deliver-offer .btn{white-space:normal;text-align:left}
html[data-landing-variant="l1"] #deliverables .deliver-offer .btn-caption{color:#c5bccb}
html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-trust{margin:24px 0 0;padding-top:20px;border-top:1px solid #554c65;font-size:var(--landing-type-caption);line-height:1.85;color:#cfc7d6}
html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-trust p{margin:0}
html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-trust p+p{margin-top:6px;color:#b4abbc}
html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-trust p.offer-credit{margin-top:6px;color:inherit}

@media(min-width:900px){
  html[data-landing-variant="l1"] #deliverables{padding:104px 0 112px}
  html[data-landing-variant="l1"] #deliverables h2{margin-bottom:28px}
  html[data-landing-variant="l1"] #deliverables .deliver-docs{grid-template-columns:1fr 1fr;gap:22px;margin-top:58px;align-items:stretch}
  html[data-landing-variant="l1"] #deliverables .deliver-doc{padding:30px 30px 30px}
  html[data-landing-variant="l1"] #deliverables .deliver-doc .doc-desc{min-height:3.7em}
  html[data-landing-variant="l1"] #deliverables .deliver-doc .solo a{grid-column:2 / 10}
  html[data-landing-variant="l1"] #deliverables .deliver-doc .solo{margin-top:34px}
  html[data-landing-variant="l1"] #deliverables .deliver-inside{grid-template-columns:repeat(3,minmax(0,1fr));gap:0 36px;border-top:0;margin-top:64px}
  html[data-landing-variant="l1"] #deliverables .deliver-inside li{grid-template-columns:1fr;gap:14px;align-content:start;border-top:1px solid var(--line);border-bottom:0;padding:24px 0 0}
  html[data-landing-variant="l1"] #deliverables .deliver-offer{display:grid;grid-template-columns:minmax(0,1fr);padding:44px 52px 40px;margin-top:64px}
  html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-cta{grid-column:1;grid-row:1;align-self:center;margin-top:0}
  html[data-landing-variant="l1"] #deliverables .deliver-offer .btn{white-space:nowrap;gap:18px;padding-inline:26px}
  html[data-landing-variant="l1"] #deliverables .deliver-offer .offer-trust{grid-column:1;margin-top:30px}
}
@media(min-width:900px) and (max-width:1000px){html[data-landing-variant="l1"] #deliverables .deliver-offer{padding:40px 36px 36px}}