/* Editorial frame buying pages only. Shared header, gallery and delivery band keep their own styles. */
.frame-guide { background:#fff; color:#202735; }
.frame-guide.storefront-main { padding-top:0; }
.frame-guide ~ .site-footer { margin-top:0; }
.frame-guide *, .frame-guide *::before, .frame-guide *::after { box-sizing:border-box; }
.frame-guide [hidden] { display:none !important; }
.frame-guide .fg-shell { width:100%; max-width:1440px; margin:0 auto; padding-left:32px; padding-right:32px; }
.frame-guide :where(p) { color:#596477; font-size:17px; line-height:1.65; margin:0 0 20px; }
.frame-guide :where(h2) { color:#202735; font-size:36px; font-weight:700; line-height:1.15; letter-spacing:-.6px; margin:0 0 20px; }
.frame-guide :where(h3) { color:#202735; font-size:23px; font-weight:600; line-height:1.25; margin:0 0 12px; }
.frame-guide a { color:#293a60; text-underline-offset:4px; }
.frame-guide a:focus-visible, .frame-guide button:focus-visible, .frame-guide summary:focus-visible { outline:3px solid #546ea6; outline-offset:4px; }
.frame-guide .fg-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; color:#687384; font-size:14px; line-height:1.5; margin-bottom:24px; }
.frame-guide .fg-breadcrumb a { color:#596477; }
.frame-guide .fg-lead { font-size:19px; line-height:1.6; max-width:900px; margin:18px 0 0; }
.frame-guide .fg-eyebrow { margin:0 0 12px; font-size:13px; line-height:1.5; font-weight:600; letter-spacing:1.2px; text-transform:uppercase; color:#426957; }
.frame-guide .fg-section { padding-top:96px; padding-bottom:96px; }
.frame-guide .fg-band { background:#f7f8fa; }
.frame-guide .fg-button { display:inline-flex; justify-content:center; align-items:center; gap:14px; min-height:48px; padding:12px 20px; border:1px solid #293a60; border-radius:7px; background:#293a60; color:#fff; font-size:16px; font-weight:600; line-height:1.4; text-decoration:none; transition:background .18s ease, border-color .18s ease; }
.frame-guide .fg-button:hover { background:#1e2c4a; border-color:#1e2c4a; color:#fff; }
.frame-guide .fg-button--outline { background:#fff; color:#293a60; border-color:#c9d0db; }
.frame-guide .fg-button--outline:hover { background:#f1f4f7; color:#202735; border-color:#293a60; }
.frame-guide .fg-button svg, .frame-guide .fg-text-link svg { flex:none; }
.frame-guide .fg-text-link { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:#293a60; font-size:16px; font-weight:600; text-decoration:none; }
.frame-guide .fg-text-link:hover { text-decoration:underline; }
.frame-guide .fg-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 24px; }
.frame-guide .fg-choices { display:grid; grid-template-columns:1fr 1fr; gap:32px; padding-top:88px; padding-bottom:88px; }
.frame-guide .fg-image-link { display:block; overflow:hidden; border-radius:10px; background:#f0f1f2; }
.frame-guide .fg-image-link img { display:block; width:100%; height:auto; transition:transform .5s ease; }
@media (hover:hover) { .frame-guide .fg-image-link:hover img { transform:scale(1.015); } }
.frame-guide .fg-choice-copy { padding:22px 0 0; }
.frame-guide .fg-choice-heading { padding-bottom:10px; }
.frame-guide .fg-choice-heading h2 { font-size:29px; margin-bottom:14px; }
.frame-guide .fg-choice-heading h2 a { display:flex; justify-content:space-between; align-items:center; gap:16px; color:inherit; text-decoration:none; }
.frame-guide .fg-choice-heading h2 a:hover { text-decoration:underline; }
.frame-guide .fg-choice-heading h2 svg { flex:none; }
.frame-guide .fg-choice-copy p:not(.fg-eyebrow) { max-width:600px; }
.frame-guide .fg-size-shortcuts { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:80px; }
.frame-guide .fg-shortcut-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.frame-guide .fg-shortcut-grid a { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:66px; padding:18px; background:#fff; border:1px solid #e2e7ed; border-radius:7px; color:#202735; font-size:19px; font-weight:600; text-decoration:none; }
.frame-guide .fg-shortcut-grid a:hover { border-color:#293a60; }
.frame-guide .fg-shortcut-grid svg { width:17px; flex:none; color:#687384; }
.frame-guide .fg-split { display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.frame-guide .fg-split--reverse .fg-editorial-image { order:2; }
.frame-guide .fg-editorial-image img, .frame-guide .fg-inspiration-grid img { width:100%; height:auto; display:block; border-radius:10px; background:#f1f2f3; }
.frame-guide .fg-caption { display:block; font-size:14px; color:#687384; margin-top:12px; }
.frame-guide .fg-feature-pair { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:28px; }
.frame-guide .fg-feature-pair h3 { font-size:21px; }
.frame-guide .fg-feature-pair p { font-size:16px; margin-bottom:8px; }
.frame-guide .fg-sample-note { border-top:1px solid #e2e7ed; margin-top:24px; padding-top:24px; font-size:16px; line-height:1.65; color:#596477; }
.frame-guide .fg-sample-note strong { color:#202735; }
.frame-guide .fg-guide-layout { display:grid; grid-template-columns:5fr 6fr; gap:100px; }
.frame-guide .fg-steps { list-style:none; padding:0; margin:0; }
.frame-guide .fg-steps li { display:flex; gap:26px; padding:24px 0; border-bottom:1px solid #e2e7ed; }
.frame-guide .fg-steps li:first-child { padding-top:0; }
.frame-guide .fg-steps li:last-child { border:0; padding-bottom:0; }
.frame-guide .fg-steps li>span { color:#7c8b9d; font-size:25px; font-weight:400; line-height:1.2; }
.frame-guide .fg-steps h3 { font-size:22px; }
.frame-guide .fg-steps p { margin:0; font-size:16px; }
.frame-guide .fg-faq { display:grid; grid-template-columns:1fr 1.6fr; gap:100px; }
.frame-guide .fg-questions { border-top:1px solid #e2e7ed; }
.frame-guide .fg-questions details { border-bottom:1px solid #e2e7ed; }
.frame-guide .fg-questions summary, .frame-guide .fg-all-size-group summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:24px; font-size:20px; font-weight:600; line-height:1.4; padding:22px 0; }
.frame-guide summary::-webkit-details-marker { display:none; }
.frame-guide summary>span { font-family:Arial,sans-serif; font-size:24px; font-weight:400; color:#687384; flex:none; transition:transform .2s; }
.frame-guide details[open]>summary>span { transform:rotate(45deg); }
.frame-guide .fg-questions p { margin:0; padding:0 30px 24px 0; font-size:16px; }
.frame-guide .fg-closing-inner { display:flex; align-items:center; justify-content:space-between; gap:48px; }
.frame-guide .fg-closing-inner h2 { max-width:680px; }
.frame-guide .fg-closing-inner p { margin:0; }
.frame-guide .fg-closing-inner .fg-actions { flex:none; flex-direction:column; align-items:flex-start; gap:12px; }
.frame-guide .fg-section-heading { max-width:740px; margin-bottom:40px; }
.frame-guide .fg-directory { scroll-margin-top:24px; }
.frame-guide .fg-directory-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:48px; }
.frame-guide .fg-directory-heading h2 { font-size:32px; }
.frame-guide .fg-directory-heading p { margin-bottom:0; }
.frame-guide .fg-size-search { width:350px; flex:none; }
.frame-guide .fg-size-search label { display:block; font-size:15px; font-weight:600; margin-bottom:8px; }
.frame-guide .fg-search-field { display:flex; align-items:center; gap:10px; padding:0 12px; border:1px solid #cbd3df; border-radius:7px; background:#fff; }
.frame-guide .fg-search-field:focus-within { border-color:#293a60; box-shadow:0 0 0 3px #293a601a; }
.frame-guide .fg-search-field>svg { color:#7c889a; flex:none; }
.frame-guide .fg-search-field input { width:100%; min-width:0; min-height:48px; font:inherit; font-size:16px; color:#202735; background:none; border:0; outline:0; padding:10px 0; }
.frame-guide .fg-search-field input::-webkit-search-cancel-button { display:none; }
.frame-guide .fg-search-field button { border:0; background:none; color:#596477; font-size:24px; width:36px; height:44px; flex:none; cursor:pointer; }
.frame-guide .fg-size-search p { font-size:13px; line-height:1.4; margin-top:8px; min-height:19px; }
.frame-guide .fg-size-jumps { display:flex; flex-wrap:wrap; gap:8px; margin:30px 0 42px; }
.frame-guide .fg-size-jumps a { display:inline-flex; align-items:center; min-height:42px; padding:9px 14px; border:1px solid #dbe1e9; border-radius:6px; background:#fff; color:#404c5d; font-size:14px; text-decoration:none; }
.frame-guide .fg-size-jumps a:hover { border-color:#293a60; color:#202735; }
.frame-guide .fg-size-families { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px 36px; }
.frame-guide .fg-size-family { scroll-margin-top:28px; }
.frame-guide .fg-size-family h3 { font-size:23px; margin-bottom:8px; }
.frame-guide .fg-size-family>p { font-size:15px; margin-bottom:20px; }
.frame-guide .fg-size-list { list-style:none; padding:0; margin:0; border-top:1px solid #dce2e9; }
.frame-guide .fg-size-list li { border-bottom:1px solid #dce2e9; }
.frame-guide .fg-size-list a { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:51px; padding:11px 4px; color:#202735; text-decoration:none; }
.frame-guide .fg-size-list a:hover { background:#eaf0f5; }
.frame-guide .fg-size-list strong { font-size:18px; font-weight:600; }
.frame-guide .fg-size-list small { display:inline-block; font-size:14px; font-weight:400; color:#687384; margin-left:16px; }
.frame-guide .fg-size-list svg { flex:none; width:17px; color:#687384; }
.frame-guide .fg-custom-size { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; align-items:flex-start; padding:32px; background:#293a60; color:#fff; border-radius:10px; }
.frame-guide .fg-custom-size::before { content:''; position:absolute; z-index:-1; inset:0; background:#3d577b; clip-path:polygon(0 52%,100% 33%,100% 100%,0 100%); }
.frame-guide .fg-custom-size h3 { color:inherit; font-size:44px; line-height:1.03; letter-spacing:-1.2px; margin:0; }
.frame-guide .fg-custom-size p { color:inherit; font-size:16px; margin:0 0 20px; }
.frame-guide .fg-custom-size .fg-ad-eyebrow { color:#e0e8e5; font-size:13px; margin-bottom:18px; }
.frame-guide .fg-ad-art { align-self:center; width:100%; max-width:270px; margin:18px 0; }
.frame-guide .fg-ad-art svg { display:block; width:100%; height:auto; }
.frame-guide .fg-custom-size .fg-button { margin-top:auto; background:#fff; border-color:#fff; color:#293a60; }
.frame-guide .fg-custom-size .fg-button:hover { background:#e9eff3; border-color:#e9eff3; }
.frame-guide .fg-custom-size .fg-text-link { color:#fff; margin-top:8px; font-size:14px; }
.frame-guide .fg-all-sizes { margin-top:56px; }
.frame-guide .fg-all-sizes>p { font-size:16px; }
.frame-guide .fg-all-size-group { border-top:1px solid #dce2e9; }
.frame-guide .fg-all-size-group:last-child { border-bottom:1px solid #dce2e9; }
.frame-guide .fg-all-size-group summary { padding:20px 0; font-size:19px; }
.frame-guide .fg-size-list--compact { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 28px; margin-bottom:28px; border:0; }
.frame-guide .fg-size-list--compact strong { font-size:16px; font-weight:400; }
.frame-guide .fg-size-list--compact a { min-height:44px; }
.frame-guide .fg-no-sizes { background:#fff; padding:36px; border-radius:8px; }
.frame-guide .fg-inspiration-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.frame-guide .fg-inspiration-grid h3 { margin-top:24px; }
.frame-guide .fg-inspiration-grid p { font-size:16px; margin-bottom:8px; }
@media (max-width:1199px) {
    .frame-guide .fg-split, .frame-guide .fg-faq, .frame-guide .fg-guide-layout, .frame-guide .fg-size-shortcuts { gap:40px; }
    .frame-guide .fg-shortcut-grid { grid-template-columns:1fr 1fr; }
    .frame-guide .fg-feature-pair { grid-template-columns:1fr; gap:20px; }
    .frame-guide .fg-directory-heading { align-items:flex-start; }
    .frame-guide .fg-size-search { width:310px; }
    .frame-guide .fg-size-list small { margin-left:10px; font-size:13px; }
}
@media (max-width:991px) {
    .frame-guide .fg-shell { padding-left:24px; padding-right:24px; }
    .frame-guide .fg-section { padding-top:72px; padding-bottom:72px; }
    .frame-guide :where(h2) { font-size:32px; }
    .frame-guide .fg-choices { gap:24px; padding-top:64px; padding-bottom:64px; }
    .frame-guide .fg-choice-heading h2 { font-size:26px; }
    .frame-guide .fg-size-families { grid-template-columns:1fr 1fr; }
    .frame-guide .fg-size-list--compact { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .frame-guide .fg-directory-heading { display:block; }
    .frame-guide .fg-size-search { width:100%; max-width:460px; margin-top:24px; }
    .frame-guide .fg-closing-inner { display:block; }
    .frame-guide .fg-closing-inner .fg-actions { flex-direction:row; align-items:center; margin-top:28px; gap:12px 24px; }
    .frame-guide .fg-inspiration-grid { gap:24px; }
    .frame-guide .fg-inspiration-grid h3 { font-size:21px; }
}
@media (max-width:767px) {
    .frame-guide .fg-shell { padding-left:18px; padding-right:18px; }
    .frame-guide .fg-section { padding-top:56px; padding-bottom:56px; }
    .frame-guide .fg-breadcrumb { margin-bottom:20px; font-size:13px; }
    .frame-guide .fg-lead { font-size:17px; }
    .frame-guide .fg-desktop-break { display:none; }
    .frame-guide :where(h2) { font-size:30px; }
    .frame-guide :where(p) { font-size:16px; }
    .frame-guide .fg-choices, .frame-guide .fg-split, .frame-guide .fg-guide-layout, .frame-guide .fg-faq, .frame-guide .fg-size-shortcuts, .frame-guide .fg-inspiration-grid { grid-template-columns:1fr; gap:32px; }
    .frame-guide .fg-choices { gap:44px; padding-top:56px; padding-bottom:56px; }
    .frame-guide .fg-choice-copy { padding-top:22px; }
    .frame-guide .fg-choice-heading h2 { font-size:27px; }
    .frame-guide .fg-button { font-size:15px; }
    .frame-guide .fg-split--reverse .fg-editorial-image { order:0; }
    .frame-guide .fg-feature-pair { gap:24px; }
    .frame-guide .fg-shortcut-grid a { min-height:58px; font-size:18px; }
    .frame-guide .fg-questions summary { font-size:18px; padding:20px 0; }
    .frame-guide .fg-questions p { padding-right:0; }
    .frame-guide .fg-directory-heading h2 { font-size:29px; }
    .frame-guide .fg-size-families { grid-template-columns:1fr; gap:36px; }
    .frame-guide .fg-size-jumps { margin:22px 0 32px; gap:7px; }
    .frame-guide .fg-size-jumps a { font-size:13px; padding:8px 11px; }
    .frame-guide .fg-size-list small { font-size:14px; margin-left:18px; }
    .frame-guide .fg-size-list--compact { grid-template-columns:1fr 1fr; gap:0 20px; }
    .frame-guide .fg-size-list--compact strong { font-size:15px; }
    .frame-guide .fg-size-list--compact svg { width:14px; }
    .frame-guide .fg-all-sizes { margin-top:40px; }
    .frame-guide .fg-custom-size { padding:28px; }
    .frame-guide .fg-section-heading { margin-bottom:28px; }
    .frame-guide .fg-inspiration-grid { gap:40px; }
    .frame-guide .fg-inspiration-grid h3 { font-size:23px; margin-top:20px; }
    .frame-guide .fg-no-sizes { padding:24px; }
}
@media (prefers-reduced-motion:reduce) { .frame-guide *, .frame-guide *::before { transition:none !important; scroll-behavior:auto !important; } }

.frame-guide .homepage-gallery { margin:0; }
.frame-guide .fg-closing { background:#fff; border-top:1px solid #e2e7ed; }
.frame-guide .fg-directory { padding-top:64px; }
@media (max-width:767px) {
    .frame-guide .fg-directory { padding-top:40px; }
}
.frame-guide .fg-directory[data-searching="true"] .fg-directory-heading { margin-bottom:32px; }

/* Landing-page introduction: the approved Vision / Tailwind image-tile composition. */
.frame-guide .fg-hero { overflow:hidden; }
.frame-guide .fg-hero-inner { position:relative; min-height:540px; display:flex; align-items:center; padding-top:36px; padding-bottom:52px; }
.frame-guide .fg-hero-copy { position:relative; z-index:1; width:49%; max-width:620px; }
.frame-guide .fg-hero .fg-breadcrumb { margin-bottom:30px; }
.frame-guide .fg-hero h1 { margin:0; font-size:56px; line-height:1.06; letter-spacing:-1.5px; font-weight:700; color:#202735; }
.frame-guide .fg-hero h1 span { color:#426957; }
.frame-guide .fg-hero .fg-lead { max-width:510px; margin-top:22px; }
.frame-guide .fg-hero .fg-actions { margin-top:28px; }
.frame-guide .fg-hero .fg-hero-note { margin:20px 0 0; font-size:14px; line-height:1.5; color:#596477; }
.frame-guide .fg-hero-art { position:absolute; inset:0 min(-32px,calc((1440px - 100vw) / 2 - 32px)) 0 calc(54% + 12px); pointer-events:none; overflow:hidden; -webkit-mask-image:linear-gradient(#000 calc(100% - 48px),transparent); mask-image:linear-gradient(#000 calc(100% - 48px),transparent); }
.frame-guide .fg-hero-tiles { display:grid; grid-template-columns:repeat(5,clamp(166px,16vw,260px)); align-items:start; gap:26px; padding:0 16px; }
.frame-guide .fg-hero-column { display:grid; gap:26px; }
.frame-guide .fg-hero-column:nth-child(1) { transform:translateY(-55px); }
.frame-guide .fg-hero-column:nth-child(2) { transform:translateY(-132px); }
.frame-guide .fg-hero-column:nth-child(3) { transform:translateY(-15px); }
.frame-guide .fg-hero-column:nth-child(4) { transform:translateY(-95px); }
.frame-guide .fg-hero-column:nth-child(5) { transform:translateY(-40px); }
.frame-guide .fg-hero-column:nth-child(n+4) { display:none; }
.frame-guide .fg-hero-art picture, .frame-guide .fg-hero-art img { display:block; width:100%; height:auto; }
.frame-guide .fg-hero-art img { filter:drop-shadow(0 10px 12px #293a601a); }
.frame-guide .fg-hero--sizes .fg-hero-column:nth-child(1) { transform:translateY(-110px); }
.frame-guide .fg-hero--sizes .fg-hero-column:nth-child(2) { transform:translateY(-35px); }
.frame-guide .fg-trust-strip { padding:30px 0; background:#f4f6f8; border-top:1px solid #e5e9ee; border-bottom:1px solid #e5e9ee; }
.frame-guide .fg-trust-desktop { min-height:28px; }
.frame-guide .fg-trust-mobile { display:none; min-height:140px; }
.frame-guide .fg-trust-strip a { display:block; text-align:center; font-size:14px; }
@media (min-width:1700px) { .frame-guide .fg-hero-column:nth-child(4) { display:grid; } }
@media (min-width:2300px) { .frame-guide .fg-hero-column:nth-child(5) { display:grid; } }
@media (max-width:1199px) {
    .frame-guide .fg-hero h1 { font-size:50px; }
    .frame-guide .fg-hero .fg-actions { gap:10px 20px; }
    .frame-guide .fg-custom-size { padding:28px; }
    .frame-guide .fg-custom-size h3 { font-size:38px; }
}
@media (max-width:991px) {
    .frame-guide .fg-hero-inner { min-height:510px; padding-top:28px; padding-bottom:40px; }
    .frame-guide .fg-hero-copy { width:51%; }
    .frame-guide .fg-hero h1 { font-size:43px; }
    .frame-guide .fg-hero .fg-lead { font-size:18px; }
    .frame-guide .fg-hero-art { left:56%; right:-24px; }
    .frame-guide .fg-hero-tiles { grid-template-columns:repeat(5,166px); gap:20px; }
    .frame-guide .fg-hero-column { gap:20px; }
}
@media (max-width:767px) {
    .frame-guide .fg-hero-inner { display:block; min-height:0; padding-top:24px; padding-bottom:0; }
    .frame-guide .fg-hero-copy { width:100%; max-width:540px; }
    .frame-guide .fg-hero .fg-breadcrumb { margin-bottom:24px; font-size:12px; }
    .frame-guide .fg-hero .fg-eyebrow { font-size:12px; margin-bottom:12px; }
    .frame-guide .fg-hero h1 { max-width:440px; font-size:42px; line-height:1.08; letter-spacing:-1px; }
    .frame-guide .fg-hero .fg-lead { font-size:17px; margin-top:18px; }
    .frame-guide .fg-hero .fg-actions { margin-top:22px; }
    .frame-guide .fg-hero .fg-hero-note { font-size:13px; margin-top:14px; }
    .frame-guide .fg-hero-art { position:relative; inset:auto; height:210px; margin:28px -18px 0; -webkit-mask-image:linear-gradient(transparent,#000 12px,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(transparent,#000 12px,#000 calc(100% - 24px),transparent); }
    .frame-guide .fg-hero-tiles { grid-template-columns:repeat(5,156px); gap:18px; width:max-content; margin-left:calc(50% - 252px); padding:0; }
    .frame-guide .fg-hero-column { gap:18px; }
    .frame-guide .fg-hero-column:nth-child(1) { transform:translateY(-60px); }
    .frame-guide .fg-hero-column:nth-child(2) { transform:translateY(-150px); }
    .frame-guide .fg-hero-column:nth-child(3) { transform:translateY(-40px); }
    .frame-guide .fg-custom-size { padding:32px; }
    .frame-guide .fg-custom-size h3 { font-size:44px; }
    .frame-guide .fg-ad-art { max-width:240px; }
}
@media (max-width:575px) {
    .frame-guide .fg-trust-desktop { display:none; }
    .frame-guide .fg-trust-mobile { display:block; }
    .frame-guide .fg-trust-strip { padding:24px 0; }
}
@media (max-width:420px) {
    .frame-guide .fg-hero h1 { font-size:38px; }
    .frame-guide .fg-hero-art { height:180px; }
    .frame-guide .fg-hero-tiles { grid-template-columns:repeat(5,126px); margin-left:calc(50% - 207px); }
    .frame-guide .fg-hero-column:nth-child(1) { transform:translateY(-48px); }
    .frame-guide .fg-hero-column:nth-child(2) { transform:translateY(-115px); }
    .frame-guide .fg-hero-column:nth-child(3) { transform:translateY(-28px); }
    .frame-guide .fg-hero .fg-text-link { font-size:14px; }
}