@charset "UTF-8";.guide{--guide-navy: #001489;--guide-navy-deep: #000b5f;--guide-red: #b10b2d;--guide-ink: #141927;--guide-muted: #4f5c6f;--guide-text-muted: #33405a;--guide-copy: #303b50;--guide-cream: #f8f5ef;--guide-warm: #fff8ed;--guide-blue-soft: #eef4ff;--guide-border: rgba(0, 20, 137, .14);--guide-shadow: 0 22px 54px rgba(0, 20, 137, .18);font-family:var(--font-accent-family);color:var(--guide-ink);margin-block:32px}.guide__inner{max-width:1200px;margin:0 auto;padding-inline:16px}.guide__hero{display:grid;align-items:start;min-height:0;margin-bottom:32px;border:1px solid rgba(0,20,137,.1);background:radial-gradient(circle at 82% 18%,rgba(0,20,137,.12),transparent 18rem);box-shadow:0 24px 70px #0014891a;overflow:hidden;gap:2rem;padding:40px 20px 20px;border-radius:44px}.guide__hero-content{position:relative;z-index:2}.guide__eyebrow{margin:0 0 .75rem;font-family:var(--font-display-family);font-size:.85rem;font-weight:var(--font-display-weight);color:var(--guide-red);letter-spacing:.06em;text-transform:uppercase}.guide__title{max-width:100%;margin:0;font-family:var(--font-display-family);font-size:2.4rem;font-weight:var(--font-display-weight);color:var(--guide-navy);letter-spacing:0;text-wrap:balance}.guide__lede{max-width:41rem;margin:1.2rem 0 0;font-size:1rem;color:var(--guide-text-muted)}.guide__hero-priorities{display:grid;max-width:37rem;padding:0;margin:1.15rem 0 0;list-style:none;gap:.55rem}.guide__hero-priorities li{padding-left:1.55rem;position:relative;color:#283854}.guide__hero-priorities li:before{content:"";width:.72rem;height:.72rem;position:absolute;top:.45em;left:0;border-radius:50%;background:radial-gradient(circle at 50% 50%,#fff 0 28%,transparent 30%),var(--guide-red);box-shadow:0 0 0 .24rem #b10b2d1a}.guide__actions{display:flex;flex-flow:column nowrap;gap:.8rem;margin-top:1.25rem}.guide__button{display:inline-flex;align-items:center;justify-content:center;min-height:3rem;padding:.95rem 1.35rem;font-family:var(--font-display-family);font-size:1rem;font-weight:var(--font-display-weight);text-decoration:none;border:1px solid var(--guide-navy);border-radius:.5rem;transition:transform .18s ease,background-color .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease}.guide__button:focus-visible{outline:3px solid rgba(177,11,45,.42);outline-offset:3px}.guide__button--primary{border-color:var(--guide-red);background:var(--guide-red);box-shadow:0 14px 30px #b10b2d38}.guide__button--primary,.guide__button--primary:hover,.guide__button--primary:focus,.guide__button--primary:active{color:#fff}.guide__button--secondary{color:var(--guide-navy);background:#fff}.guide__button--secondary:focus-visible{color:#fff;border-color:var(--guide-navy);background:var(--guide-navy);box-shadow:0 8px 18px #0014892e}.guide__hero-panel{display:grid;align-content:start;align-self:start;width:100%;position:relative;z-index:1;border:1px solid rgba(0,20,137,.12);background:radial-gradient(circle at 85% 10%,rgba(0,20,137,.1),transparent 14rem),linear-gradient(180deg,#fffffffa,#f1f5fffa);box-shadow:0 18px 42px #0014891a;overflow:hidden;isolation:isolate;justify-self:stretch;gap:.85rem;padding:16px;border-radius:24px}.guide__hero-panel:before{content:"";height:58%;position:absolute;z-index:-1;border-radius:999px;background:#00148914;inset:auto -18% -18% 22%}.guide__hero-image{display:block;width:100%;aspect-ratio:4/3;height:auto;-o-object-fit:cover;object-fit:cover;border-radius:8px;background:#ffffffb3;box-shadow:0 12px 28px #0014891a}.guide__panel-label{margin:0;font-family:var(--font-display-family);font-size:.85rem;font-weight:var(--font-display-weight);color:var(--guide-red);letter-spacing:.06em;text-transform:uppercase}.guide__panel-title{margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:var(--guide-navy);letter-spacing:0}.guide__panel-list{display:grid;padding:0;margin:0;list-style:none;gap:.65rem}.guide__panel-list li{padding-left:1.1rem;position:relative;margin:unset;color:var(--guide-text-muted)}.guide__panel-list li:before{content:"";width:.4rem;height:.4rem;position:absolute;top:.62em;left:0;border-radius:999px;background:var(--guide-red)}.guide__summary{display:grid;padding:1.25rem;margin-bottom:clamp(2.5rem,5vw,4.5rem);border:1px solid rgba(0,20,137,.12);border-radius:1rem;background:var(--guide-cream);gap:1rem}.guide__summary-title{margin:0;font-family:var(--font-display-family);font-size:1.25rem;font-weight:var(--font-display-weight);color:var(--guide-navy)}.guide__summary-links{display:flex;flex-wrap:wrap;padding:0;margin:0;list-style:none;gap:.65rem}.guide__summary-links li{margin:unset}.guide__summary-link{display:inline-flex;padding:.25rem 1rem;font-size:.85rem;font-weight:600;color:var(--guide-navy);text-decoration:none;border:1px solid rgba(0,20,137,.16);border-radius:999px;background:#fff;transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease}.guide__summary-link:focus-visible{outline:3px solid rgba(177,11,45,.42);outline-offset:3px;color:#fff;border-color:var(--guide-navy);background:var(--guide-navy);box-shadow:0 8px 18px #0014892e}.guide__body{display:grid;gap:0;padding-bottom:clamp(3rem,6vw,5rem)}.guide__section{display:grid;grid-template-columns:1fr;gap:1rem;padding:2rem 0}.guide__section[id]{border-top:1px solid var(--guide-border)}.guide__section-title{margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:var(--guide-navy);letter-spacing:0}.guide__section-content{color:var(--guide-copy)}.guide__section-content p{margin:0 0 1rem}.guide__section-content p:last-child{margin-bottom:0}.guide__section-content ul{display:grid;padding-left:1.25rem;margin:1rem 0;gap:.75rem}.guide__section-content ul:last-child{margin-bottom:0}.guide__section-content li::marker{color:var(--guide-red)}.guide__section-content strong{font-weight:700;color:var(--guide-ink)}.guide__callout,.guide__quote{position:relative;margin:clamp(1.25rem,2.8vw,2rem) 0;border-left:unset}.guide__callout{padding:clamp(1rem,2.4vw,1.45rem);border:1px solid rgba(0,20,137,.14);border-left:.34rem solid var(--guide-red);border-radius:.9rem;background:linear-gradient(90deg,rgba(177,11,45,.07),transparent 34%),#fff;box-shadow:0 12px 28px #00148912;overflow:hidden}.guide__callout:after{content:"";width:8rem;height:8rem;position:absolute;border:1px solid rgba(0,20,137,.12);border-radius:999px;inset:auto -2rem -2.5rem auto}.guide__callout--warning{background:linear-gradient(90deg,rgba(0,20,137,.08),transparent 38%),#fff}.guide__callout--soft{border-left-color:var(--guide-navy);background:linear-gradient(90deg,rgba(0,20,137,.07),transparent 36%),var(--guide-blue-soft)}.guide__callout--soft .guide__callout-label{color:var(--guide-navy)}.guide__callout-label{margin:0 0 .35rem;font-family:var(--font-display-family);font-size:.85rem;font-weight:var(--font-display-weight);color:var(--guide-red);letter-spacing:.06em;text-transform:uppercase}.guide__callout-text{max-width:42rem;position:relative;z-index:1;margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:var(--guide-ink);letter-spacing:0}.guide__quote{padding:clamp(1.25rem,3vw,2rem) clamp(1.2rem,3vw,2.1rem);color:var(--guide-navy);border-top:1px solid rgba(0,20,137,.14);border-bottom:1px solid rgba(0,20,137,.14)}.guide__quote:before{content:"\201c";display:block;height:2rem;font-family:Georgia,Times New Roman,serif;font-size:5rem;line-height:.75;color:#b10b2d47}.guide__quote p{max-width:42rem;margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:var(--guide-navy);letter-spacing:0;text-wrap:balance}.guide__image-card{display:grid;align-items:center;padding:32px 16px 16px;border-radius:32px;margin:clamp(1rem,3vw,2rem) 0;border:1px solid rgba(0,20,137,.12);box-shadow:0 18px 44px #00148914;gap:clamp(1.25rem,3vw,2rem)}.guide__image-card--azure{background:radial-gradient(circle at 92% 14%,rgba(177,11,45,.08),transparent 17rem),linear-gradient(135deg,#fff,#eef4ff)}.guide__image-card--skin{background:radial-gradient(circle at 12% 16%,rgba(0,20,137,.08),transparent 18rem),linear-gradient(135deg,#fff,#fff8ed)}.guide__image-card-content{min-width:0}.guide__image-card-content p:not(.guide__eyebrow){max-width:38rem;margin:1rem 0 0;color:var(--guide-copy)}.guide__image-card-title{max-width:100%;margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:var(--guide-navy);letter-spacing:0}.guide__image-card-list{display:grid;padding:0;margin:1rem 0 0;list-style:none;gap:.6rem}.guide__image-card-list li{padding-left:1.1rem;position:relative;margin:unset;color:var(--guide-text-muted)}.guide__image-card-list li:before{content:"";width:.42rem;height:.42rem;position:absolute;top:.62em;left:0;border-radius:999px;background:var(--guide-red)}.guide__image-card-media{min-width:0;margin:0;border-radius:16px;background:#fff;box-shadow:0 16px 36px #00148921;overflow:hidden}.guide__image-card-media figcaption{padding:.85rem 1rem 1rem;margin:0;font-size:.85rem;color:var(--guide-muted)}.guide__image-card-image{display:block;width:100%;aspect-ratio:4/3;height:auto;-o-object-fit:cover;object-fit:cover}.guide__note{padding:1rem 1.1rem;margin-top:1rem;color:var(--guide-ink);border-left:.25rem solid var(--guide-red);background:#f1f5ff}.guide__cta{margin:0 0 clamp(3rem,6vw,5rem);color:#fff;border-radius:40px;background:radial-gradient(circle at 85% 10%,rgba(255,255,255,.22),transparent 18rem),linear-gradient(135deg,var(--guide-navy) 0%,var(--guide-navy-deep) 100%);overflow:hidden}.guide__cta .guide__eyebrow{color:var(--guide-warm)}.guide__cta .guide__button--primary{box-shadow:0 16px 30px #0000002e}.guide__cta-inner{display:grid;gap:1.5rem;align-items:center;padding:48px 16px 16px;border-radius:40px}.guide__cta-heading{margin:0;font-family:var(--font-display-family);font-weight:var(--font-display-weight);color:#fff;letter-spacing:0}.guide__cta-body{max-width:36rem;margin:1rem 0 0;line-height:1.6;color:#ffffffe6}.guide__cta-points{display:flex;flex-wrap:wrap;padding:0;margin:1.25rem 0 0;list-style:none;gap:.6rem}.guide__cta-points li{padding:.25rem 1rem;font-size:.85rem;border:1px solid rgba(255,255,255,.24);border-radius:10rem}.guide__cta-media{min-width:0;padding:16px;border-radius:24px;background:radial-gradient(circle at 50% 20%,#fffffff5,#ffffffd1 48%,#eef4ffeb);box-shadow:inset 0 0 0 1px #ffffffad,0 22px 42px #0000002e}.guide__cta-image{display:block;width:100%;height:auto;max-height:460px;margin:0 auto;border-radius:8px;filter:drop-shadow(0 16px 24px rgba(0,20,137,.16))}@keyframes shingles-guide-reveal{0%{transform:translateY(16px);opacity:0}to{transform:translateY(0);opacity:1}}@media(hover:hover)and (pointer:fine){.guide__button:hover{transform:translateY(-2px)}.guide__button--primary:hover{color:#fff;border-color:#970923;background:#970923}.guide__button--secondary:hover,.guide__summary-link:hover{color:#fff;border-color:var(--guide-navy);background:var(--guide-navy)}}@media(prefers-reduced-motion:no-preference){.guide__hero-content,.guide__hero-media,.guide__summary,.guide__section,.guide__cta{animation:shingles-guide-reveal .56s ease both}.guide__hero-media{animation-delay:90ms}.guide__summary{animation-delay:.15s}}@media(min-width:768px){.guide{margin-block:64px}.guide__inner{width:min(1120px,100% - 56px)}.guide__hero{align-items:center;justify-content:space-between;margin-bottom:64px;border-radius:56px;grid-template-columns:repeat(2,1fr);padding:20px 20px 20px 40px}.guide__hero-panel{padding:24px;border-radius:32px}.guide__hero-image{border-radius:16px}.guide__summary{grid-template-columns:210px 1fr;align-items:center}.guide__section{grid-template-columns:1fr 1.6fr}.guide__section-content{grid-column:2}.guide__image-card{padding:16px 16px 16px 32px;grid-template-columns:1.2fr 1fr}.guide__image-card--image-first{grid-template-columns:1fr 1.2fr;padding-inline:16px 32px}.guide__image-card--image-first .guide__image-card-media{grid-column:1;grid-row:1}.guide__image-card--image-first .guide__image-card-content{grid-column:2}.guide__callout{width:calc(62.5% - 1rem);margin-left:auto}.guide__cta-inner{grid-template-columns:minmax(0,1fr) minmax(260px,.5fr);padding:24px 24px 24px 32px}}@media(min-width:1024px){.guide__actions{flex-flow:row wrap}.guide__hero-content{max-width:620px}}
/*# sourceMappingURL=/cdn/shop/t/105/assets/section-guide.css.map */
