/* Tailwind v4 site stylesheet. Single source of truth for design + custom CSS.
 *
 * At draft time, this is read inline into a <style type="text/tailwindcss"> block.
 * At publish time, the Tailwind CLI compiles this file (plus templates) into
 * dist/styles.css. Every directive works here: @theme, @layer, @utility,
 * @apply, @keyframes, plus plain CSS. Do NOT write <style> blocks in PHP
 * templates for theme CSS — put it here so it lands in the compiled bundle.
 *
 * functions.php also parses the @theme block at runtime to register the
 * palette + font sizes with Gutenberg via add_theme_support().
 *
 * Conventions:
 *   1. @theme: tokens only (--color-*, --font-*, --text-*, --radius-*). No
 *      selectors, no @apply. Tokens auto-generate matching utilities.
 *   2. Plain CSS: outside @theme, inside @layer. Prefer utility classes in
 *      templates first; only write CSS here when utilities cannot express it.
 *      @layer base { h1 { font-size: var(--text-2xl); } }
 *      @layer components { .card { padding: --spacing(6); } }
 *   3. New reusable utilities: prefer @utility over @apply.
 *      @utility content-auto { content-visibility: auto; }
 *   4. Custom web fonts: load via <link> in template-parts/head.php, then
 *      reference here via --font-*.
 *
 * Token naming (Tailwind v4):
 *   --color-{slug}        → bg-{slug}, text-{slug}, border-{slug}
 *   --color-{slug}-{NN}   → numeric shades (skipped in the Gutenberg palette)
 *   --font-{slug}         → font-{slug}
 *   --text-{slug}         → text-{slug}
 *   --radius-{slug}       → rounded-{slug}
 */

@theme {
	--color-primary: #2563eb;
	--color-primary-50:  #eff6ff;
	--color-primary-100: #dbeafe;
	--color-primary-500: #3b82f6;
	--color-primary-600: #2563eb;
	--color-primary-700: #1d4ed8;
	--color-primary-900: #1e3a8a;

	--color-secondary: #475569;
	--color-secondary-50:  #f8fafc;
	--color-secondary-100: #f1f5f9;
	--color-secondary-200: #e2e8f0;
	--color-secondary-300: #cbd5e1;
	--color-secondary-500: #64748b;
	--color-secondary-600: #475569;
	--color-secondary-700: #334155;
	--color-secondary-900: #0f172a;

	--color-neutral: #171717;
	--color-background: #ffffff;

	--font-sans:  system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-serif: Georgia, "Times New Roman", serif;
	--font-mono:  ui-monospace, "SF Mono", Menlo, monospace;

	--text-sm:   0.875rem;
	--text-base: 1rem;
	--text-lg:   1.125rem;
	--text-xl:   1.25rem;
	--text-2xl:  1.5rem;
	--text-3xl:  1.875rem;
	--text-4xl:  2.25rem;
	--text-5xl:  3rem;
}

/* Element-level defaults. Reach for utility classes in templates first; put
 * a rule here only when the same styling needs to apply across every instance
 * of an element (e.g. body font features). Keep this layer small. */
@layer base {
	/* body { font-feature-settings: "ss01", "ss02"; } */
}

/* Reusable component classes. Use for compound patterns that recur and need
 * a name (e.g. .card, .hero-heading, .divider). Reference tokens via var();
 * @apply works but is finicky — prefer var() + utility classes in templates. */
@layer components {
	/* .hero-heading em { font-style: italic; color: var(--color-primary); } */
}

/* ALLU PepTalk */
.allu-peptalk-shell{
  --pt-ink:#111217;
  --pt-muted:#626772;
  --pt-line:#e8e9ec;
  --pt-cream:#f7f7f5;
  --pt-cream-2:#ffffff;
  --pt-blush:#fff0f5;
  --pt-pink:#F7A6C4;
  --pt-blue:#1746e8;
  --pt-white:#fff;
  color:var(--pt-ink);
  background:#fff;
  font-family:Poppins,Arial,sans-serif;
}
.allu-peptalk-shell *{box-sizing:border-box}
.allu-peptalk-shell a{color:inherit;text-decoration:none}
.allu-peptalk-shell svg{width:20px;height:20px;display:block}
.pt-wrap{width:min(1220px,calc(100% - 48px));margin:0 auto}
.pt-kicker,.pt-overline,.pt-section-heading p,.pt-category{
  font-size:10px;
  line-height:1.2;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:600;
}
.pt-kicker,.pt-overline,.pt-section-heading p{color:#7d7671}
.pt-primary-button,.pt-secondary-button{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 19px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.pt-primary-button{background:var(--pt-ink);color:#fff!important;box-shadow:0 12px 30px rgba(23,23,25,.12)}
.pt-secondary-button{background:#fff;border:1px solid var(--pt-line)}
.pt-primary-button:hover,.pt-secondary-button:hover{transform:translateY(-1px)}
.pt-primary-button svg,.pt-secondary-button svg,.pt-card-link svg{width:16px;height:16px}
.pt-icon-ring{
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:#fff;border:1px solid var(--pt-line);color:var(--pt-ink)
}
.pt-section-heading{display:flex;gap:17px;align-items:flex-start}
.pt-section-heading>span{
  width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;
  font:600 10px Poppins,Arial,sans-serif;
  background:#fff;border:1px solid var(--pt-line);color:#8b837d;
  flex:0 0 34px
}
.pt-section-heading p{margin:3px 0 8px}
.pt-section-heading h2{
  margin:0;
  font-family:Poppins,Arial,sans-serif;
  font-weight:500;
  font-size:clamp(40px,4.8vw,72px);
  line-height:.92;
  letter-spacing:-.06em
}

/* Access */
.pt-access{
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(440px,.98fr);
  background:linear-gradient(135deg,#1746e8 0%,#315cf0 48%,#F7A6C4 100%);
}
.pt-access-art{
  position:relative;
  overflow:hidden;
  min-height:100svh;
  background:
    radial-gradient(circle at 22% 28%,rgba(255,255,255,.24),transparent 30%),
    linear-gradient(145deg,#1746e8 0%,#315cf0 58%,#F7A6C4 100%);
}
.pt-access-art:after{
  content:"";
  position:absolute;
  inset:0;
  background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.3
}
.pt-access-brand{
  position:absolute;top:42px;left:46px;z-index:2;
  color:#fff;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:42px;letter-spacing:.08em
}
.pt-access-badge{
  position:absolute;left:12%;bottom:15%;z-index:3;
  width:230px;aspect-ratio:1.6/1;
  padding:26px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:#F7A6C4;
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 30px 70px rgba(68,45,38,.18);
  transform:rotate(-7deg)
}
.pt-access-badge span{font-size:17px;letter-spacing:.2em}
.pt-access-badge small{margin-top:10px;font-size:8px;letter-spacing:.19em}
.pt-access-orb{position:absolute;border-radius:50%;filter:blur(1px)}
.pt-access-orb-one{width:330px;height:330px;right:-90px;top:10%;background:rgba(255,255,255,.28)}
.pt-access-orb-two{width:260px;height:260px;left:-70px;bottom:-50px;background:rgba(115,82,69,.12)}
.pt-access-card{
  min-height:100svh;
  padding:72px clamp(36px,7vw,105px);
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(16px)
}
.pt-access-card .pt-kicker{margin:22px 0 13px}
.pt-access-card h1{
  margin:0;
  font-family:Poppins,Arial,sans-serif;
  font-size:clamp(54px,6.2vw,86px);
  line-height:.9;
  letter-spacing:-.065em;
  font-weight:500
}
.pt-access-card h1 em{font-weight:500;font-style:normal;color:var(--pt-blue)}
.pt-access-copy{
  max-width:590px;margin:28px 0 24px;
  color:#68615c;font-size:14px;line-height:1.8
}
.pt-password-form{width:min(100%,540px);display:grid;gap:12px}
.pt-password-form input{
  width:100%;height:54px;border:1px solid #ddd3cd;border-radius:14px;
  background:#fff;padding:0 16px;font:400 13px Poppins,Arial,sans-serif;outline:0
}
.pt-password-form input:focus{border-color:#b99ba2;box-shadow:0 0 0 3px rgba(239,197,207,.24)}
.pt-password-form button{
  height:54px;border:0;border-radius:14px;background:#1746e8;color:#fff;
  display:flex;align-items:center;justify-content:center;gap:10px;
  font:600 12px Poppins,Arial,sans-serif;cursor:pointer
}
.pt-password-form button svg{width:16px}
.pt-access-footnote{
  display:flex;align-items:center;gap:9px;margin:18px 0 0;color:#7d756f;
  font-size:10px;line-height:1.6
}
.pt-access-footnote svg{width:15px;height:15px;flex:0 0 15px}

/* Home */
.pt-home{background:#fff}
.pt-home-hero{
  width:min(1380px,calc(100% - 28px));
  margin:14px auto 0;
  min-height:560px;
  display:grid;
  grid-template-columns:1.08fr .92fr;
  overflow:hidden;
  border-radius:28px;
  background:#f7f7f5;
  border:1px solid var(--pt-line)
}
.pt-home-hero-copy{
  padding:clamp(48px,7vw,94px);
  display:flex;flex-direction:column;justify-content:center;
  position:relative;z-index:2
}
.pt-home-hero-copy h1{
  margin:5px 0 0;
  font-family:Poppins,Arial,sans-serif;
  font-size:clamp(68px,8.2vw,120px);
  font-weight:500;line-height:.84;letter-spacing:-.07em
}
.pt-home-lead{max-width:610px;margin:30px 0 28px;color:#625d59;font-size:15px;line-height:1.75}
.pt-search-wrap{
  width:min(670px,100%);height:55px;
  display:flex;align-items:center;gap:12px;
  padding:0 17px;background:#fff;border:1px solid #ddd6d1;border-radius:999px;
  box-shadow:0 14px 36px rgba(46,34,28,.06)
}
.pt-search-wrap svg{color:#625e5b;flex:0 0 20px}
.pt-search-wrap input{
  width:100%;border:0;outline:0;background:transparent;
  font:400 12px Poppins,Arial,sans-serif;color:#242325
}
.pt-filter-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.pt-filter-row button{
  min-width:76px;height:35px;padding:0 15px;border:1px solid #e1d9d4;border-radius:999px;
  background:rgba(255,255,255,.58);color:#514c49;font:500 10px Poppins,Arial,sans-serif;cursor:pointer
}
.pt-filter-row button.is-active{background:#1d1d20;color:#fff;border-color:#1d1d20}
.pt-home-hero-art{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 22% 24%,rgba(255,255,255,.3),transparent 24%),
    linear-gradient(155deg,#1746e8 0%,#315cf0 58%,#F7A6C4 100%)
}
.pt-home-hero-art:after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.25) 39% 41%,transparent 42% 100%)
}
.pt-art-label{
  position:absolute;right:38px;top:40px;z-index:2;
  font-size:10px;line-height:1.35;letter-spacing:.17em;color:#fff;text-align:right
}
.pt-art-curve{
  position:absolute;width:520px;height:720px;border-radius:50%;
  left:8%;top:11%;border:1px solid rgba(255,255,255,.45);
  transform:rotate(-16deg)
}
.pt-art-card{
  position:absolute;z-index:3;left:17%;bottom:12%;width:225px;height:140px;
  border-radius:18px;background:#F7A6C4;border:1px solid rgba(255,255,255,.52);
  box-shadow:0 28px 60px rgba(69,42,31,.18);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  transform:rotate(-7deg)
}
.pt-art-card span{font-family:"Cormorant Garamond",Georgia,serif;font-size:42px;letter-spacing:.07em}
.pt-art-card small{margin-top:4px;font-size:9px;letter-spacing:.22em}
.pt-start{padding:94px 0 74px}
.pt-start-layout{display:grid;grid-template-columns:1.16fr .84fr;gap:20px;margin-top:28px}
.pt-start-feature,.pt-consult-mini{
  border:1px solid var(--pt-line);border-radius:24px;padding:32px
}
.pt-start-feature{
  min-height:310px;
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
  background:
    radial-gradient(circle at 70% 25%,rgba(255,255,255,.84),transparent 29%),
    linear-gradient(140deg,#eee4dc,#f9f5f1)
}
.pt-script{
  margin:0 0 20px!important;
  font-family:"Cormorant Garamond",Georgia,serif!important;
  font-size:clamp(35px,4vw,56px)!important;
  line-height:.95!important;letter-spacing:-.035em;color:#2c2928!important
}
.pt-start-feature>p:not(.pt-script){max-width:760px;margin:0;color:#68615d;font-size:13px;line-height:1.8}
.pt-start-feature>a{margin-top:24px;display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600}
.pt-start-feature>a svg{width:15px}
.pt-consult-mini{
  background:linear-gradient(145deg,#f8e6e8,#f4d6dc);
  display:flex;flex-direction:column;align-items:flex-start;justify-content:center
}
.pt-consult-mini .pt-overline{margin:21px 0 8px}
.pt-consult-mini h3{
  margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:39px;line-height:.95;font-weight:500
}
.pt-consult-mini>p:not(.pt-overline){margin:15px 0 20px;color:#6f6261;font-size:12px;line-height:1.7}
.pt-guide-section{padding:70px 0;border-top:1px solid var(--pt-line);scroll-margin-top:90px}
.pt-beginner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:28px}
.pt-beginner-grid article{
  min-height:220px;padding:25px;border:1px solid var(--pt-line);border-radius:20px;background:#fff
}
.pt-beginner-grid article svg{width:28px;height:28px;margin-bottom:25px}
.pt-beginner-grid h3{margin:0 0 8px;font-size:15px}
.pt-beginner-grid p{margin:0;color:#736d69;font-size:11px;line-height:1.7}
.pt-library{padding:72px 0 96px;border-top:1px solid var(--pt-line)}
.pt-library-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:30px}
.pt-results-count{margin:0;color:#827b76;font-size:11px}
.pt-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pt-product-card{
  display:block;border:1px solid var(--pt-line);border-radius:20px;background:#fff;overflow:hidden;
  transition:transform .24s ease,box-shadow .24s ease
}
.pt-product-card:hover{transform:translateY(-3px);box-shadow:0 20px 50px rgba(48,37,31,.08)}
.pt-product-card[hidden]{display:none}
.pt-product-image{
  aspect-ratio:1.18/1;display:grid;place-items:center;padding:42px;
  background:linear-gradient(180deg,#faf7f4,#f0e8e2)
}
.pt-product-image img{width:100%;height:100%;object-fit:contain;transition:transform .3s ease}
.pt-product-card:hover .pt-product-image img{transform:scale(1.035)}
.pt-product-image>span{font-family:"Cormorant Garamond",Georgia,serif;font-size:42px;letter-spacing:.08em}
.pt-product-copy{padding:20px}
.pt-category{color:#b47484}
.pt-product-copy h3{
  margin:8px 0 7px;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:32px;line-height:1;font-weight:500
}
.pt-product-copy p{min-height:56px;margin:0;color:#6e6864;font-size:11px;line-height:1.65}
.pt-card-link{margin-top:17px;display:flex;align-items:center;gap:7px;font-size:10px;font-weight:600}
.pt-no-results{padding:70px 20px;text-align:center;border:1px dashed #dcd2cc;border-radius:20px}
.pt-no-results h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:36px;margin:0 0 8px}
.pt-no-results p{margin:0;color:#77706b;font-size:12px}
.pt-responsibility{
  display:grid;grid-template-columns:.8fr 1fr auto;gap:38px;align-items:center;
  margin-bottom:100px;padding:38px;border-radius:24px;background:#f7f0ec;border:1px solid var(--pt-line)
}
.pt-responsibility h2{
  margin:7px 0 0;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:39px;line-height:.95;font-weight:500
}
.pt-responsibility>p{margin:0;color:#6f6864;font-size:11px;line-height:1.8}

/* Guide */
.pt-guide{padding:52px 0 100px;background:#fbf9f7}
.pt-back{display:inline-block;margin:0 0 24px;color:#6f6964;font-size:11px}
.pt-guide-hero{
  display:grid;grid-template-columns:minmax(320px,.78fr) minmax(0,1.22fr);gap:55px;align-items:center;
  background:#fff;border:1px solid var(--pt-line);border-radius:26px;padding:32px
}
.pt-guide-media{
  min-height:460px;border-radius:18px;background:linear-gradient(180deg,#f2e8e2,#faf7f4);
  display:grid;place-items:center;padding:55px;overflow:hidden
}
.pt-guide-media img{width:100%;height:100%;max-height:390px;object-fit:contain}
.pt-guide-placeholder{font-family:"Cormorant Garamond",Georgia,serif;font-size:72px;letter-spacing:.08em}
.pt-guide-copy h1{
  margin:8px 0 5px;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:clamp(58px,6vw,91px);line-height:.82;letter-spacing:-.05em;font-weight:500
}
.pt-guide-subtitle{margin:16px 0 14px;color:#625d59;font-size:15px}
.pt-evidence-row{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 20px}
.pt-evidence-row span{
  display:flex;align-items:center;gap:7px;padding:9px 11px;border-radius:999px;background:#f7f4f1;
  color:#645f5b;font-size:9px
}
.pt-evidence-row svg{width:14px;height:14px}
.pt-safety-banner{padding:18px;border-radius:17px;background:#f9eff0;border:1px solid #efdddf}
.pt-safety-banner strong{font-size:11px}
.pt-safety-banner p{margin:7px 0 0;color:#6e6563;font-size:10.5px;line-height:1.7}
.pt-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:18px}
.pt-section-nav{
  position:sticky;top:74px;z-index:20;
  display:flex;gap:8px;overflow-x:auto;padding:16px 0;margin:14px 0 0;
  scrollbar-width:none;background:rgba(251,249,247,.94);backdrop-filter:blur(12px)
}
.pt-section-nav::-webkit-scrollbar{display:none}
.pt-section-nav a{
  flex:0 0 auto;padding:9px 13px;border-radius:999px;background:#fff;border:1px solid var(--pt-line);
  font-size:9.5px;font-weight:500
}
.pt-guide-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px;margin-top:28px}
.pt-panel,.pt-consult-card{
  background:#fff;border:1px solid var(--pt-line);border-radius:22px;padding:26px
}
.pt-panel-wide{grid-row:span 1}
.pt-panel h3,.pt-consult-card h3{
  margin:7px 0 12px;font-family:"Cormorant Garamond",Georgia,serif;
  font-size:34px;line-height:1;font-weight:500
}
.pt-panel>p:not(.pt-overline):not(.pt-microcopy),.pt-consult-card>p:not(.pt-overline){
  margin:0;color:#716a66;font-size:11px;line-height:1.75
}
.pt-quick-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}
.pt-quick-grid>div{padding:18px;border-radius:16px;background:#faf7f4;border:1px solid #eee7e1}
.pt-quick-grid small{display:block;margin-bottom:9px;color:#8b827c;font-size:9px;text-transform:uppercase;letter-spacing:.1em}
.pt-quick-grid strong{display:block;margin-bottom:7px;font-size:14px}
.pt-quick-grid span{display:block;color:#746d69;font-size:9.5px;line-height:1.55}
.pt-beginner-band{background:transparent}
.pt-protocol-layout{display:grid;grid-template-columns:1.18fr .82fr;gap:18px;margin-top:28px}
.pt-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.pt-reference-pill{padding:8px 10px;border-radius:999px;background:#f6e8e9;color:#8c5d66;font-size:8.5px;font-weight:600;white-space:nowrap}
.pt-table-wrap{overflow-x:auto;margin-top:16px}
.pt-table{width:100%;border-collapse:collapse;min-width:610px}
.pt-table th,.pt-table td{padding:13px 12px;text-align:left;border-bottom:1px solid #eee8e3}
.pt-table th{font-size:8.5px;text-transform:uppercase;letter-spacing:.11em;color:#88807a}
.pt-table td{font-size:10.5px;color:#4f4a47}
.pt-microcopy{margin:15px 0 0;color:#8a827c;font-size:9px;line-height:1.65}
.pt-syringe-panel{display:flex;flex-direction:column}
.pt-syringe-visual{
  position:relative;height:70px;margin:28px 8px;
  border:2px solid #b7b0aa;border-radius:4px;background:linear-gradient(90deg,#f7f4f1 0 70%,#e8d4d8 70% 100%)
}
.pt-syringe-visual:before{content:"";position:absolute;left:-25px;top:31px;width:25px;height:2px;background:#8c8680}
.pt-syringe-visual:after{content:"";position:absolute;right:-22px;top:15px;width:20px;height:38px;border:2px solid #aaa39d;border-left:0;border-radius:0 10px 10px 0}
.pt-syringe-visual i{display:inline-block;width:10%;height:18px;border-left:1px solid #78716d;margin-top:48px}
.pt-syringe-visual b{position:absolute;right:29%;top:5px;width:8px;height:58px;background:#232326}
.pt-warning-card{padding:16px;border-radius:15px;background:#faf0f1;border:1px solid #efdadd}
.pt-warning-card strong{font-size:10.5px}
.pt-warning-card p{margin:6px 0 0;color:#786d6c;font-size:9.5px;line-height:1.7}
.pt-step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:28px}
.pt-step-grid article{min-height:215px;padding:23px;border:1px solid var(--pt-line);border-radius:19px;background:#fff}
.pt-step-grid article>span{display:inline-grid;width:32px;height:32px;place-items:center;border-radius:50%;background:#f8e8ea;font-size:9px}
.pt-step-grid h3{margin:28px 0 8px;font-family:"Cormorant Garamond",Georgia,serif;font-size:29px;font-weight:500}
.pt-step-grid p{margin:0;color:#756e69;font-size:10px;line-height:1.7}
.pt-safety-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.pt-panel ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:10px}
.pt-panel li{position:relative;padding-left:17px;color:#6f6965;font-size:10.5px;line-height:1.6}
.pt-panel li:before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:#d9aeb8}
.pt-consult-card{background:linear-gradient(145deg,#f8e7e9,#f2d6dc)}
.pt-consult-card .pt-primary-button{margin-top:20px}
.pt-accordion{display:grid;gap:8px;margin-top:28px}
.pt-accordion details{border:1px solid var(--pt-line);border-radius:16px;background:#fff;overflow:hidden}
.pt-accordion summary{
  list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;
  cursor:pointer;padding:17px 19px;font-size:11px;font-weight:600
}
.pt-accordion summary::-webkit-details-marker{display:none}
.pt-accordion summary span{font-size:18px;font-weight:300}
.pt-accordion details p{margin:0;padding:0 19px 18px;color:#716a65;font-size:10.5px;line-height:1.75}

@media(max-width:980px){
  .pt-access{grid-template-columns:1fr}
  .pt-access-art{min-height:310px}
  .pt-access-card{min-height:auto;padding:62px 28px}
  .pt-home-hero{grid-template-columns:1fr;min-height:0}
  .pt-home-hero-art{min-height:340px}
  .pt-start-layout,.pt-guide-hero,.pt-protocol-layout,.pt-safety-grid,.pt-guide-grid{grid-template-columns:1fr}
  .pt-product-grid{grid-template-columns:repeat(2,1fr)}
  .pt-beginner-grid{grid-template-columns:repeat(2,1fr)}
  .pt-step-grid{grid-template-columns:repeat(2,1fr)}
  .pt-responsibility{grid-template-columns:1fr}
  .pt-guide-media{min-height:350px}
  .pt-section-nav{top:0}
}
@media(max-width:620px){
  .pt-wrap{width:min(100% - 28px,1220px)}
  .pt-access-art{min-height:250px}
  .pt-access-brand{top:26px;left:24px;font-size:34px}
  .pt-access-badge{width:160px;padding:18px;left:12%;bottom:12%}
  .pt-access-badge span{font-size:13px}
  .pt-access-card{padding:46px 20px 60px}
  .pt-access-card h1{font-size:62px}
  .pt-home-hero{width:calc(100% - 16px);border-radius:20px}
  .pt-home-hero-copy{padding:50px 22px 34px}
  .pt-home-hero-copy h1{font-size:78px}
  .pt-home-lead{font-size:13px;margin:24px 0}
  .pt-home-hero-art{min-height:290px}
  .pt-art-card{width:165px;height:105px}
  .pt-art-card span{font-size:32px}
  .pt-filter-row{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .pt-filter-row::-webkit-scrollbar{display:none}
  .pt-start{padding:60px 0}
  .pt-start-feature,.pt-consult-mini{padding:24px}
  .pt-beginner-grid,.pt-product-grid,.pt-step-grid,.pt-quick-grid{grid-template-columns:1fr}
  .pt-beginner-grid article{min-height:180px}
  .pt-product-copy p{min-height:0}
  .pt-library{padding-bottom:70px}
  .pt-responsibility{margin-bottom:70px;padding:26px}
  .pt-guide{padding:30px 0 70px}
  .pt-guide-hero{padding:18px;gap:26px;border-radius:20px}
  .pt-guide-media{min-height:280px;padding:35px}
  .pt-guide-copy h1{font-size:58px}
  .pt-actions{display:grid}
  .pt-primary-button,.pt-secondary-button{width:100%}
  .pt-section-nav{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px}
  .pt-guide-section{padding:54px 0}
  .pt-panel,.pt-consult-card{padding:21px}
  .pt-panel-head{display:block}
  .pt-reference-pill{display:inline-flex;margin-top:8px}
  .pt-step-grid article{min-height:170px}
}