/* Ideas & Guides: shared WYG typography, photography and blue accents. */
.guide-hero{padding:64px 0 0;background:linear-gradient(115deg,#fff 40%,#f0f7fc);border-bottom:1px solid var(--line)}
.guide-hero h1{font-size:clamp(38px,4.4vw,62px);max-width:880px}
.guide-hero> .wrap>p{font-size:18px;max-width:680px;margin-top:23px;line-height:1.65}
.guide-area-nav{display:flex;gap:28px;flex-wrap:wrap;margin-top:34px}
.guide-area-nav a{padding:15px 0;border-bottom:3px solid transparent;font-size:15px;font-weight:750;color:#526879}
.guide-area-nav a[aria-current=page]{color:var(--blue-dark);border-color:var(--blue)}
.guide-library{padding-top:37px}
.guide-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.guide-filters{display:flex;gap:8px;flex-wrap:wrap}
.guide-filter{font-size:14px;border:1px solid var(--line);border-radius:6px;color:#466072;background:#fff;padding:10px 14px;min-height:44px}
.guide-filter.active{border-color:var(--blue);background:var(--blue);color:#fff}
.guide-search{display:flex;align-items:center;gap:10px;border:1px solid #cddde9;background:#fff;border-radius:7px;min-height:46px;padding:0 13px;flex:0 1 300px}
.guide-search input{border:0;outline-offset:4px;background:transparent;min-width:0;width:100%;padding:12px 0;font-size:15px;color:var(--ink)}
.guide-search:focus-within{outline:2px solid var(--blue);outline-offset:2px}
.guide-search input:focus{outline:none}
.guide-search .icon{color:#597386;width:19px}
.guide-result-count{font-size:14px;color:#587284;margin:17px 0}
.guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.guide-grid-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.guide-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .15s ease}
.guide-card:hover{box-shadow:0 10px 28px #163d5314}
.guide-card-image{position:relative;display:block;background:#f3f7fa;border-bottom:1px solid #e5edf3;aspect-ratio:3/2;overflow:hidden}
.guide-card-image img{width:100%;height:100%;object-fit:contain}
.guide-card-image .concept-image-badge,.guide-design-card .concept-image-badge{font-size:10px;left:10px;bottom:10px;top:auto}
.guide-card-copy{display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:23px}
.guide-category{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-dark)}
.guide-card h3{font-size:23px;line-height:1.2;letter-spacing:-.03em;margin:11px 0 12px}
.guide-card h3 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.guide-card p{font-size:16px;line-height:1.6;margin-bottom:25px}
.guide-card .text-link{font-size:13px;margin-top:auto}
.guide-card[hidden],.guide-empty[hidden],.faq-topic-group[hidden],.guide-faq-item[hidden]{display:none!important}
.guide-empty{text-align:center;padding:65px 20px;border:1px solid var(--line);border-radius:10px;background:#f6f9fb}
.guide-empty h2{font-size:29px}.guide-empty p{margin:14px auto 23px;max-width:560px}
.home-guides .section-head{align-items:flex-end}.home-guides .section-head>div{max-width:880px}
.guide-home-faq{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:28px;padding-top:22px;color:#526c7f;font-size:16px}
.guide-faq-split{display:grid;grid-template-columns:.75fr 1.25fr;gap:72px;align-items:start}
.guide-faq-split>div>p{margin:22px 0 25px;max-width:380px;font-size:16px}
.guide-faq-item{border-bottom:1px solid #d8e4ed;background:transparent;scroll-margin-top:112px}
.guide-faq-item:first-child{border-top:1px solid #d8e4ed}
.guide-faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:20px 0;cursor:pointer;list-style:none;font-size:17px;font-weight:700;line-height:1.45;color:var(--ink)}
.guide-faq-item summary::-webkit-details-marker{display:none}
.guide-faq-item summary>span{flex:none;color:var(--blue-dark);font-size:24px;font-weight:400;line-height:1;transition:transform .15s}
.guide-faq-item[open] summary>span{transform:rotate(45deg)}
.guide-faq-item summary:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:3px}
.guide-faq-item>div{padding:0 22px 23px 0}
.guide-faq-item p{font-size:16px;line-height:1.75;color:#526a7a}
.guide-faq-item .text-link{margin-top:15px;font-size:14px}
.faq-library{display:grid;grid-template-columns:240px minmax(0,850px);gap:70px;align-items:start}
.faq-topics{position:sticky;top:116px}.faq-topics h2,.guide-contents h2{font-size:15px;letter-spacing:.01em;margin-bottom:17px}
.faq-topics nav,.guide-contents nav{display:grid;gap:7px}
.faq-topics nav a{font-size:15px;line-height:1.5;padding:10px 0;border-bottom:1px solid var(--line);color:#506b7d}
.faq-topics nav a:hover,.guide-contents nav a:hover{color:var(--blue-dark)}
.faq-topics>.text-link{margin-top:25px;font-size:13px}
.faq-search{width:100%;max-width:none}
.faq-topic-group{margin-top:42px;scroll-margin-top:116px}.faq-topic-group>h2{font-size:26px;margin-bottom:13px}
.guide-next{border:1px solid #d5e4ef;border-left:4px solid var(--blue);border-radius:0 10px 10px 0;padding:29px 30px;background:#f2f8fd;margin-top:45px}
.guide-next h2{font-size:27px}.guide-next p{margin-top:14px;font-size:16px;line-height:1.65}
.guide-next small{display:block;font-size:13px;line-height:1.65;color:#5b7487;margin-top:19px}
.guide-article-header{padding-top:38px;padding-bottom:37px}
.guide-breadcrumbs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:#617b8f;margin-bottom:29px}
.guide-breadcrumbs a:hover{color:var(--blue-dark);text-decoration:underline}
.guide-article-header h1{font-size:clamp(36px,4vw,57px);max-width:1030px;margin-top:13px;line-height:1.1}
.guide-deck{font-size:20px;line-height:1.6;max-width:850px;margin-top:22px}
.guide-byline{display:flex;gap:11px;align-items:center;font-size:14px;color:#6a7e8d;margin-top:24px;flex-wrap:wrap}
.guide-article-layout{display:grid;grid-template-columns:220px minmax(0,810px);gap:65px;align-items:start;padding-bottom:65px}
.guide-contents{position:sticky;top:115px;padding-top:8px}
.guide-contents nav a{font-size:14px;line-height:1.55;color:#61798a;padding:7px 0}
.guide-contents>.text-link{font-size:12px;margin-top:24px}
.guide-article-body{min-width:0}
.guide-article-image{margin:0 0 29px}.guide-article-image img{width:100%;height:auto;max-height:525px;object-fit:contain;border-radius:10px;background:#f3f7fa;border:1px solid var(--line)}
.guide-article-image figcaption{font-size:12px;line-height:1.6;color:#6b8190;margin-top:10px}
.guide-intro{font-size:20px;line-height:1.75;color:#304e63;padding-bottom:15px}
.guide-prose{margin-top:36px;scroll-margin-top:115px}
.guide-prose h2{font-size:29px;line-height:1.2;margin-bottom:18px;letter-spacing:-.025em}
.guide-prose>p,.guide-prose li{font-size:17px;line-height:1.8;color:#4f6575}
.guide-prose>p+p{margin-top:17px}.guide-prose ul{padding-left:23px;margin:0 0 21px}.guide-prose li{padding-left:5px;margin-bottom:9px}
.guide-prose .guide-source{padding:13px 0 0;border-top:1px solid var(--line);font-size:13px;line-height:1.65;margin-top:22px}
.guide-source a{color:var(--blue-dark);text-decoration:underline;text-underline-offset:3px}.guide-source span{display:block;color:#6b8191;margin-top:5px;font-size:12px}
.guide-article-questions{margin-top:43px}.guide-article-questions>h2{font-size:28px;margin-bottom:17px}
.guide-related-designs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px}
.guide-design-card{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.guide-design-card>div{position:relative;background:#f6f9fb;aspect-ratio:3/2;border-bottom:1px solid var(--line)}
.guide-design-card img{width:100%;height:100%;object-fit:contain}.guide-design-card>span{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:20px}
.guide-design-card strong{font-size:18px;line-height:1.35}.guide-design-card small{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:800;color:var(--blue-dark)}
.guide-not-found{padding:45px 0}.guide-not-found p{margin:23px 0}
@media(max-width:1480px) and (min-width:761px){.header-actions{margin-left:auto}.header-actions .btn{display:none}.mobile-toggle{display:block}.main-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;padding:12px 5% 22px;background:#132534;gap:0;border-top:1px solid #314657;box-shadow:0 12px 22px #0717272e;max-height:calc(100vh - 100px);overflow-y:auto}.main-nav.open{display:flex}.main-nav a{font-size:14px;padding:10px 0}.main-nav a.active:after{display:none}.main-nav a.active{color:#5dbbff}}
@media(max-width:1100px){.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-faq-split{gap:36px}.guide-article-layout{grid-template-columns:180px minmax(0,1fr);gap:35px}.faq-library{grid-template-columns:200px minmax(0,1fr);gap:35px}.guide-related-designs{gap:15px}.guide-design-card>span{align-items:flex-start;flex-direction:column}}
@media(max-width:760px){.guide-hero{padding-top:38px}.guide-hero> .wrap>p{font-size:16px;margin-top:19px}.guide-area-nav{gap:23px;margin-top:24px}.guide-area-nav a{font-size:14px}.guide-toolbar{display:block}.guide-filters{gap:7px}.guide-filter{padding:10px 12px;font-size:14px}.guide-search{margin-top:18px;width:100%}.guide-grid,.guide-grid-two{grid-template-columns:1fr;gap:20px}.guide-card-image{max-height:290px}.guide-card-copy{padding:22px}.guide-card h3{font-size:24px}.home-guides .section-head{display:block}.home-guides .section-head .text-link{font-size:13px;margin-top:18px}.guide-home-faq{font-size:15px}.guide-faq-split,.faq-library,.guide-article-layout{grid-template-columns:1fr;gap:29px}.faq-topics,.guide-contents{position:static}.faq-topics nav{display:flex;flex-wrap:wrap;gap:8px}.faq-topics nav a{padding:9px 12px;background:#f3f8fb;border:1px solid var(--line);border-radius:6px;font-size:14px}.faq-topics>.text-link{display:none}.faq-search{margin-top:0}.faq-topic-group{margin-top:32px}.guide-article-header{padding-top:27px;padding-bottom:28px}.guide-breadcrumbs{margin-bottom:24px}.guide-deck{font-size:18px}.guide-byline{font-size:13px}.guide-contents{border:1px solid var(--line);padding:19px;border-radius:8px}.guide-contents nav{grid-template-columns:1fr 1fr;gap:9px 17px}.guide-contents>.text-link{display:none}.guide-intro{font-size:18px}.guide-prose h2{font-size:27px}.guide-prose>p,.guide-prose li{font-size:16px}.guide-article-layout{padding-bottom:45px}.guide-next{padding:24px 20px}.guide-next h2{font-size:25px}.guide-related-designs{grid-template-columns:1fr}.guide-design-card>span{flex-direction:row;align-items:center}.guide-design-card>div{max-height:300px}}
@media(prefers-reduced-motion:reduce){.guide-card,.guide-faq-item summary>span{transition:none}}