/* Responsive reference components, scoped to the sections ported in round 3. */
.reference-layout{display:contents;--orange:#ff4d00;--craft-measure:1280px;--orange-light:#ff681c;--panel:#131313;--line:#292929;--bg:#070707;--muted:#9d9d9d}
@scope (.reference-layout){
.section-heading,.eyebrow,.wordmark,.phone,.hero,.section,.manifesto,h1,h2,h3,p{all:revert;box-sizing:border-box}
*{all:revert;box-sizing:border-box}
*{box-sizing: border-box;}
button, input, select, textarea{font: inherit;}
a, button, input, select, textarea{-webkit-tap-highlight-color: transparent;}
button{cursor: pointer;}
button:disabled{cursor: wait; opacity: 0.5;}
a{text-decoration: none;}
a, button{color: inherit;}
button{background: none; border: 0px;}
img{display: block; max-width: 100%; object-fit: cover;}
input, select, textarea{color: inherit; background: rgb(24, 24, 24); border: 1px solid rgb(53, 53, 53); border-radius: 9px; padding: 12px 13px; outline: none;}
textarea{resize: vertical;}
h1, h2, h3, p{margin-top: 0px;}
h1, h2, h3{letter-spacing: -0.025em;}
p{line-height: 1.65; color: rgb(181, 181, 181);}
a, button{transition: background 0.18s, color 0.18s, border-color 0.18s, transform 0.18s;}
.button{display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; padding: 10px 22px; border-radius: 24px; font-size: 14px; white-space: nowrap; font-weight: 500;}
.button.outline{border: 1px solid rgb(98, 98, 98); background: transparent;}
.button.black{background: rgb(8, 8, 8); color: white;}
.icon-button{display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; padding: 0px; flex-shrink: 0;}
.fine-print a, .text-link{color: rgb(239, 239, 239); display: inline-flex; align-items: center; gap: 8px;}
.eyebrow, .fine-print a:hover, .text-link:hover{color: var(--orange);}
.eyebrow{display: block; font-size: 11px; letter-spacing: 0.17em; font-weight: 600; margin-bottom: 15px;}
.wordmark{display: inline-flex; align-items: baseline; font-size: 28px; font-weight: 800; letter-spacing: -1.8px; white-space: nowrap; color: rgb(255, 255, 255);}
.wordmark > span{color: var(--orange);}
.hero{min-height: 500px; position: relative; background: radial-gradient(at 50% 32%, rgba(62, 17, 4, 0.5) 0px, transparent 46%), linear-gradient(rgb(9, 2, 0), rgb(3, 3, 3)); display: flex; justify-content: center; align-items: center; text-align: center; padding: 58px 20px 66px;}
.hero-content{position: relative; z-index: 2; width: 100%;}
.hero h1{font-weight: 600; font-size: 40px; margin: 0px 0px 27px; letter-spacing: -0.025em; line-height: 1.3;}
.hero-model-link{display: inline-flex; align-items: center; gap: 6px; font-size: 10px; color: rgb(153, 101, 77); margin-top: 20px;}
.composer-wrap{width: min(100%, 760px); margin: 0px auto; position: relative; text-align: left;}
.segmented{display: inline-flex; align-items: center; border: 1px solid rgb(99, 53, 31); border-radius: 22px; padding: 3px; background: linear-gradient(rgba(50, 21, 7, 0.58), rgba(69, 20, 2, 0.32)); gap: 2px;}
.segmented button{font-size: 13px; padding: 8px 18px; border-radius: 20px; color: rgb(190, 190, 190); white-space: nowrap;}
.segmented button.active{background: linear-gradient(rgba(169, 70, 37, 0.667), rgba(224, 76, 21, 0.2)); border: 1px solid rgb(180, 115, 90); color: white; padding: 7px 17px; box-shadow: rgba(255, 255, 255, 0.063) 0px 1px 8px inset;}
.composer-tabs{display: flex; width: max-content; margin: 0px auto 20px; box-shadow: rgba(255, 77, 0, 0.063) 0px 10px 20px;}
.composer-panel{border: 1px solid rgb(52, 33, 22); background: linear-gradient(110deg, rgb(16, 8, 5), rgba(16, 6, 3, 0.85)); border-radius: 24px; box-shadow: rgba(255, 77, 0, 0.024) 0px 0px 0px 3px, rgba(255, 77, 0, 0.075) 0px 0px 30px; position: relative; min-height: 163px; padding: 12px;}
.composer-input{display: flex; align-items: flex-start; gap: 15px; min-height: 98px;}
.composer-input textarea{flex: 1 1 0%; min-width: 0px; border: 0px; background: transparent; padding: 4px 0px; font-size: 14px; font-weight: 400; line-height: 1.6; min-height: 82px; color: rgb(238, 238, 238); box-shadow: none !important;}
.composer-input textarea::placeholder{color: rgb(129, 129, 129);}
.composer-controls{display: flex; align-items: center; gap: 8px; min-height: 30px; flex-wrap: nowrap;}
.control-pill{display: flex; align-items: center; gap: 5px; background: rgb(36, 24, 17); border-radius: 20px; padding: 7px 11px; white-space: nowrap; font-size: 12px; color: rgb(196, 191, 187);}
.control{display: flex; align-items: center; gap: 6px; white-space: nowrap; font-size: 12px; padding: 5px 1px; color: rgb(170, 170, 170);}
.control svg{color: rgb(179, 170, 165);}
.model-control > span{max-width: 140px; overflow: hidden; text-overflow: ellipsis;}
.output-control{border-left: 1px solid rgb(75, 51, 40); padding-left: 10px;}
.composer-spacer{flex: 1 1 0%;}
.composer-controls .icon-button{color: rgb(153, 153, 153); width: 26px; height: 26px;}
.credit-hint{font-size: 10px; color: rgb(117, 105, 98);}
.submit-button{width: 33px; height: 33px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgb(52, 34, 25); color: rgb(235, 190, 167); flex-shrink: 0;}
.section{padding: 92px 54px; text-align: center; max-width: 1520px; margin: auto;}
.section-heading{max-width: 780px; margin: 0px auto 36px;}
.section-heading h2{font-size: 42px; font-weight: 600; line-height: 1.13; margin-bottom: 18px;}
.section-heading p{font-size: 16px; line-height: 1.55; color: rgb(150, 150, 150); max-width: 750px; margin: auto;}
.section > .button, .section > .text-link{margin-top: 28px;}
.manifesto{position: relative; background: var(--orange); color: rgb(7, 7, 7); text-align: center; overflow: hidden; padding: 80px 25px 74px;}
.manifesto > span{font-size: 11px; letter-spacing: 0.15em; position: relative; z-index: 1;}
.manifesto h2{font-size: clamp(60px, 8.2vw, 122px); font-weight: 800; line-height: 0.92; letter-spacing: -0.065em; margin: 26px 0px;}
.manifesto h2, .manifesto > .button{position: relative; z-index: 1;}
.manifesto-circle{position: absolute; width: 900px; height: 900px; border: 1px solid rgba(0, 0, 0, 0.133); border-radius: 50%; left: calc(50% - 450px); top: -245px; box-shadow: rgba(0, 0, 0, 0.016) 0px 0px 0px 100px, rgba(0, 0, 0, 0.01) 0px 0px 0px 200px;}
.models-section{background: radial-gradient(rgba(42, 16, 6, 0.4), transparent 67%);}
.model-pills{display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; max-width: 1100px; margin: auto;}
.model-pills a{display: inline-flex; align-items: center; gap: 12px; background: rgb(22, 22, 22); border: 1px solid rgb(43, 43, 43); border-radius: 12px; padding: 17px 20px; font-size: 14px;}
.model-symbol{font-weight: 800; font-size: 17px; color: var(--orange); font-style: italic;}
.mobile-section{display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; text-align: left; padding: 80px 100px; background: radial-gradient(at 68% 50%, rgba(50, 19, 5, 0.25), transparent 65%);}
.mobile-section h2{font-size: 47px; line-height: 1.1;}
.mobile-section p{font-size: 14px;}
.phone{width: 220px; height: 400px; background: rgb(14, 14, 14); border: 5px solid rgb(45, 45, 45); box-shadow: rgb(0, 0, 0) 0px 20px 80px; border-radius: 32px; padding: 28px 12px 12px; margin: auto; position: relative; transform: rotate(7deg);}
.phone-notch{position: absolute; top: 8px; left: 70px; width: 70px; height: 13px; background: rgb(0, 0, 0); border-radius: 10px;}
.phone .wordmark{font-size: 20px;}
.phone > img{width: 100%; height: 265px; border-radius: 10px; margin-top: 15px;}
.phone > div:last-child{display: flex; justify-content: space-between; align-items: center; font-size: 9px; background: rgb(34, 34, 34); padding: 8px; border-radius: 10px; margin-top: 9px;}
.phone > div:last-child :is(button,a){color: var(--orange);}
@media (max-width: 1360px) {.hero{min-height: 480px;}
.hero h1{font-size: 38px;}
.section{padding: 80px 40px;}
.section-heading h2{font-size: 38px;}
.mobile-section{padding: 75px 70px;}
}
@media (max-width: 1024px) {.section{padding: 70px 30px;}
.section-heading h2{font-size: 34px;}
.section-heading p{font-size: 14px;}
.mobile-section h2{font-size: 37px;}
}
@media (max-width: 768px) {.wordmark{font-size: 26px;}
.hero{min-height: 445px; padding: 55px 24px 53px;}
.hero h1{font-size: 32px;}
.composer-panel{border-radius: 20px;}
.composer-controls{gap: 5px;}
.model-control > span{max-width: 118px;}
.control-pill > svg:first-child, .model-control > svg:first-child{display: none;}
.output-control{font-size: 10px;}
.credit-hint, .sound-control > svg{display: none;}
.section{padding: 65px 25px;}
.section-heading h2{font-size: 33px;}
.section-heading{margin-bottom: 30px;}
.section-heading p{font-size: 13px;}
.eyebrow{font-size: 10px;}
.manifesto{padding: 65px 25px;}
.manifesto h2{font-size: 80px;}
.model-pills{gap: 10px;}
.model-pills a{font-size: 12px; padding: 14px 16px; gap: 8px;}
.mobile-section{gap: 25px; padding: 65px 30px; grid-template-columns: 1fr 1fr;}
.mobile-section h2{font-size: 34px;}
.phone{width: 190px; height: 353px; padding: 27px 10px 10px;}
.phone-notch{left: 57px; width: 65px;}
.phone > img{height: 220px;}
.mobile-section p{font-size: 12px;}
.mobile-section .button{font-size: 11px; padding: 10px 16px;}
}
@media (max-width: 560px) {.hero{padding: 43px 17px 36px; min-height: 416px;}
.hero h1{font-size: 30px; line-height: 1.2; max-width: 380px; margin: 0px auto 25px;}
.composer-tabs{margin-bottom: 15px;}
.segmented button{font-size: 12px; padding: 7px 17px;}
.segmented button.active{padding: 6px 16px;}
.composer-panel{padding: 11px; border-radius: 19px; min-height: 190px;}
.composer-input{gap: 11px; min-height: 110px;}
.composer-input textarea{font-size: 13px; min-height: 90px;}
.composer-controls{flex-wrap: wrap; gap: 7px 9px; position: relative; padding-right: 36px;}
.control-pill{font-size: 10px; padding: 6px 9px;}
.model-control{font-size: 11px;}
.model-control > span{max-width: 130px;}
.output-control{border-left: 0px; font-size: 10px; padding: 3px 0px;}
.settings-control{order: 5;}
.composer-spacer{display: none;}
.save-control{order: 6;}
.submit-button{position: absolute; right: 0px; bottom: 1px; width: 30px; height: 30px;}
.hero-model-link{margin-top: 17px;}
.section{padding: 60px 20px;}
.section-heading h2{font-size: 30px; line-height: 1.18;}
.section-heading p{font-size: 13px; line-height: 1.65;}
.section-heading{margin-bottom: 27px;}
.manifesto{padding: 58px 20px;}
.manifesto h2{font-size: 63px; margin: 24px 0px;}
.manifesto > span{font-size: 9px;}
.models-section .section-heading h2{font-size: 31px;}
.model-pills{gap: 8px;}
.model-pills a{padding: 12px 14px; font-size: 11px; border-radius: 10px;}
.model-symbol{font-size: 15px;}
.mobile-section{grid-template-columns: 1fr; text-align: center; gap: 38px;}
.mobile-section h2{font-size: 34px;}
.mobile-section .eyebrow{text-align: center;}
.phone{width: 215px; height: 391px;}
.phone > img{height: 257px;}
.phone-notch{left: 66px;}
}
@media (max-width: 360px) {.hero h1{font-size: 27px;}
.hero{padding-left: 13px; padding-right: 13px;}
.section{padding-left: 17px; padding-right: 17px;}
.section-heading h2{font-size: 27px;}
.composer-panel{padding: 10px;}
.model-control > span{max-width: 117px;}
.composer-controls{gap: 6px 8px;}
.composer-input{gap: 9px;}
.composer-input textarea{font-size: 12px;}
.manifesto h2{font-size: 53px;}
}
.composer-resize{position: absolute; right: 12px; top: 7px; z-index: 2; color: rgb(111, 98, 92); padding: 5px; opacity: 0.65;}
.composer-input textarea{resize: none; transition: min-height 0.2s;}
.direction-section{display: grid; grid-template-columns: 1fr 1fr; gap: 75px; align-items: center;}
.direction-section h2{font-size: 42px; line-height: 1.18;}
.direction-preview{border: 1px solid rgb(56, 48, 42); padding: 10px; border-radius: 21px; position: relative; background: rgb(20, 17, 15); transform: rotate(-2deg); box-shadow: rgba(255, 77, 0, 0.043) 0px 20px 70px;}
.direction-preview > img{border-radius: 13px; width: 100%; height: 300px;}
.direction-badge{position: absolute; top: 23px; left: 23px; display: flex; align-items: center; gap: 8px; border-radius: 6px; padding: 7px 10px; background: rgba(0, 0, 0, 0.467); font-size: 11px; backdrop-filter: blur(8px);}
.direction-preview > div{display: flex; align-items: center; justify-content: space-between; padding: 18px 12px; font-size: 12px; color: rgb(168, 163, 159);}
.direction-preview > div > :is(button,a){background: var(--orange); color: rgb(8, 8, 8); padding: 7px; border-radius: 50%; display: flex;}
@media (max-width: 768px) {.direction-section{gap: 30px;}
.direction-section h2{font-size: 32px;}
.direction-preview > img{height: 260px;}
}
@media (max-width: 560px) {.direction-section, .nested-fields{grid-template-columns: 1fr;}
.direction-section{gap: 28px;}
.direction-section h2{font-size: 32px;}
.direction-preview{transform: none;}
.direction-preview > img{height: 240px;}
}
button:disabled{cursor: not-allowed;}
.tooltip-anchor{display: inline-flex; align-items: center; position: relative;}
.composer-wrap{width: min(100%, 700px);}
.composer-panel{padding: 12px; border-radius: 24px; min-height: 164px; border-color: rgba(255, 255, 255, 0.04); background: rgba(9, 3, 1, 0.9); box-shadow: rgba(255, 73, 0, 0.133) 0px 0px 0px 1px, rgba(255, 73, 0, 0.07) 0px 0px 32px; transition: box-shadow 0.2s, border-color 0.2s;}
.composer-input{gap: 15px; min-height: 104px;}
.prompt-editor{flex: 1 1 0%; min-width: 0px; position: relative; padding-right: 15px;}
.prompt-editor textarea{width: 100%; min-height: 88px; padding: 0px; font-size: 14px; line-height: 1.6; scrollbar-width: thin;}
.composer-resize{top: 6px; right: 5px; opacity: 0; transition: opacity 0.15s;}
.composer-controls{gap: 10px; min-height: 30px;}
.control{font-size: 12px; padding: 4px 3px; border-radius: 5px; color: rgb(188, 180, 175);}
.model-control{max-width: 165px;}
.model-control > span{max-width: 126px; overflow: hidden; text-overflow: ellipsis;}
.output-control, .settings-control, .sound-control{position: relative;}
.output-control::after, .sound-control::after{content: ""; height: 12px; width: 1px; background: rgba(255, 255, 255, 0.125); position: absolute; right: -6px; top: 50%; transform: translateY(-50%);}
.control-pill{background: rgba(255, 255, 255, 0.027); font-size: 12px; padding: 7px 12px;}
.submit-button{width: 34px; height: 34px; background: rgba(255, 255, 255, 0.03); color: rgb(128, 118, 111); transition: background 0.2s, color 0.2s, transform 0.2s;}
.composer-controls .save-control{width: 25px;}
.model-symbol{width: 44px; height: 44px; border-radius: 9px; background: rgba(255, 255, 255, 0.035); display: flex; align-items: center; justify-content: center; color: rgb(219, 214, 211); flex: 0 0 auto;}
.hero h1{font-size: 46px; font-weight: 600; margin-bottom: 26px; line-height: 1.25;}
.hero{min-height: 460px; padding: 66px 20px 58px;}
.hero-model-link{margin-top: 17px;}
@media (max-width: 1360px) {.hero h1{font-size: 40px;}
.hero{padding-top: 64px;}
}
@media (max-width: 768px) {.hero h1{font-size: 33px;}
.composer-controls{gap: 8px;}
.model-control{max-width: 155px;}
}
@media (max-width: 560px) {.hero{padding: 46px 16px 38px; min-height: 440px;}
.hero h1{font-size: 31px;}
.composer-panel{min-height: 190px; padding: 12px; border-radius: 20px;}
.composer-input{gap: 12px; min-height: 111px;}
.prompt-editor{padding-right: 5px;}
.prompt-editor textarea{font-size: 13px; min-height: 93px;}
.composer-resize{opacity: 0.6;}
.composer-controls{gap: 8px 9px; padding-right: 38px;}
.control-pill{padding: 6px 10px;}
.control, .control-pill{font-size: 11px;}
.model-control{max-width: 142px;}
.model-control > span{max-width: 109px;}
.output-control::after, .sound-control::after{display: none;}
}
@media (max-width: 360px) {.prompt-editor textarea{font-size: 12px;}
.control-pill{font-size: 10px;}
.model-control > span{max-width: 101px;}
.hero h1{font-size: 29px;}
}
@media (min-width: 1280px) and (max-width: 1360px) {.wordmark{font-size: 25px;}
}
.wordmark{letter-spacing: -1.35px; gap: 5px;}
.credit-hint{font-feature-settings: "tnum"; font-variant-numeric: tabular-nums;}
.creative-atmosphere{position: absolute; inset: 0px; pointer-events: none; overflow: hidden;}
.creative-atmosphere-grid{position: absolute; inset: 0px; background-image: linear-gradient(rgba(255, 77, 0, 0.02) 1px, transparent 0px), linear-gradient(90deg, rgba(255, 77, 0, 0.02) 1px, transparent 0px); background-size: 72px 72px; mask-image: radial-gradient(at 50% 45%, rgb(0, 0, 0), transparent 70%);}
.creative-atmosphere-light{position: absolute; inset: 0px; background: radial-gradient(at 50% 12%, rgba(255, 77, 0, 0.063), transparent 64%);}
.hero, .product-home-hero{background: var(--bg);}
.hero h1{font-weight: 650; letter-spacing: -0.035em; text-wrap: balance;}
.composer-panel{background: rgb(17, 17, 17); border-color: rgb(60, 44, 37); border-radius: 20px; box-shadow: rgba(0, 0, 0, 0.2) 0px 16px 48px;}
.composer-tabs{background: rgb(21, 21, 21); border-color: rgb(60, 44, 37); box-shadow: none;}
.composer-tabs > button.active{background: rgb(56, 34, 24); border-color: rgb(169, 82, 45); box-shadow: none;}
@media (max-width: 767px) {.creative-atmosphere-grid{background-size: 48px 48px;}
}
:is(h1, h2, h3){text-wrap: balance;}
p{text-wrap: pretty;}
button:disabled{cursor: not-allowed;}
.hero:not(.product-home-hero){padding: 64px 24px 48px; min-height: 510px;}
.hero h1{font-size: clamp(40px, 4.1vw, 62px); line-height: 1.18; font-weight: 600; letter-spacing: -0.045em; margin-bottom: 30px;}
.hero .composer-wrap{position: relative;}
.hero .composer-wrap::after, .hero .composer-wrap::before{content: ""; position: absolute; z-index: 1; width: 18px; height: 18px; border-color: rgba(255, 77, 0, 0.37); border-style: solid; pointer-events: none;}
.hero .composer-wrap::before{left: -9px; top: 47px; border-width: 1px 0px 0px 1px;}
.hero .composer-wrap::after{right: -9px; bottom: -9px; border-width: 0px 1px 1px 0px;}
.creative-atmosphere-light{background: radial-gradient(at 50% 8%, rgba(255, 77, 0, 0.07), transparent 67%);}
.hero .composer-panel{border-radius: 18px; border-color: rgb(60, 51, 44); padding: 18px;}
.hero-model-link{font-size: 12px; color: rgb(177, 142, 120); margin-top: 24px;}
.composer-tabs{margin-bottom: 24px; padding: 4px;}
.composer-tabs > button{min-height: 36px; font-size: 12px;}
.prompt-editor textarea{font-size: 14px; line-height: 1.8;}
.prompt-editor textarea::placeholder{color: rgb(152, 147, 141);}
.composer-controls{gap: 6px 10px;}
.composer-controls :is(.control, .control-pill){min-height: 34px; font-size: 12px;}
.composer-controls .icon-button{min-width: 34px; min-height: 34px;}
.composer-controls .submit-button{width: 38px; height: 38px;}
.section{max-width: var(--craft-measure); margin-inline: auto; padding: 100px 32px;}
.section-heading{max-width: 880px; margin: 0px auto 40px;}
.section-heading h2{font-size: clamp(32px, 3.3vw, 48px); line-height: 1.25; font-weight: 600; letter-spacing: -0.035em;}
.section-heading p{max-width: 670px; margin: 20px auto 0px; font-size: 15px; line-height: 1.85; color: var(--craft-muted);}
.eyebrow{font-size: 10px; letter-spacing: 0.19em; font-weight: 600;}
.manifesto{overflow: hidden; border-block: 1px solid rgba(255, 255, 255, 0.08);}
.manifesto h2{font-weight: 700; letter-spacing: -0.045em;}
.direction-preview{border-radius: 18px; border: 1px solid var(--craft-border);}
.button{min-height: 44px; font-size: 13px; font-weight: 500; border-radius: 10px; transition: background .2s,border-color .2s,transform .22s var(--craft-ease);}
@media (max-width: 1024px) {.section{padding: 76px 28px;}
.hero:not(.product-home-hero){padding-top: 66px;}
.hero h1{font-size: 44px;}
}
@media (max-width: 767px) {.hero:not(.product-home-hero), .product-home-hero{padding: 44px 20px 40px; min-height: 0px;}
.hero h1{font-size: clamp(30px, 8.2vw, 40px); line-height: 1.3; margin-bottom: 26px;}
.hero .composer-panel{padding: 14px; border-radius: 16px;}
.hero .composer-wrap::before{left: -5px;}
.hero .composer-wrap::after{right: -5px; bottom: -5px;}
.composer-tabs{margin-bottom: 20px;}
.composer-tabs > button{min-height: 40px; padding-inline: 17px;}
.prompt-editor textarea{font-size: 16px; line-height: 1.7;}
.composer-controls{padding-right: 48px; gap: 4px 8px;}
.composer-controls :is(.control, .control-pill){min-height: 40px; font-size: 11px;}
.composer-controls .icon-button{min-width: 40px; min-height: 40px;}
.composer-controls .submit-button{width: 44px; height: 44px; bottom: 0px;}
.hero-model-link{font-size: 11px; margin-top: 20px;}
.section{padding: 64px 20px;}
.section-heading{margin-bottom: 30px;}
.section-heading h2{font-size: clamp(28px, 7.5vw, 34px); line-height: 1.35;}
.section-heading p{font-size: 14px; line-height: 1.8; margin-top: 16px;}
}
@media (max-width: 380px) {.hero:not(.product-home-hero), .product-home-hero{padding-inline: 16px;}
.hero h1{font-size: 29px;}
.hero .composer-panel{padding: 12px;}
.composer-controls{gap: 4px 6px;}
}
@media (prefers-reduced-motion: reduce) {.hero .composer-wrap::after, .hero .composer-wrap::before{transition: none;}
}
.hero-keyword-subtitle{max-width: 780px; margin: 18px auto 30px; text-wrap: balance; font-size: 15px; line-height: 1.7; color: rgb(188, 179, 173);}
.hero-resource-links{display: flex; gap: 24px; justify-content: center; flex-wrap: wrap; margin-top: 22px;}
.hero-resource-links .hero-model-link{margin-top: 0px;}
@media (max-width: 760px) {.hero-keyword-subtitle{font-size: 12px; margin: 15px 14px 24px;}
.hero-resource-links{gap: 14px;}
}
.composer-credit_hint__hUUTb.composer-credit_hint__hUUTb{display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 3px; min-width: 0px; max-width: 210px; font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; white-space: normal; line-height: 1.45; text-align: right; color: rgb(170, 170, 170);}
@media (max-width: 767px) {.composer-credit_hint__hUUTb.composer-credit_hint__hUUTb{max-width: min(190px, 100%); font-size: 10px;}
}

}

@scope (.reference-layout){
.final-cta{padding:100px 32px;text-align:center;background:radial-gradient(rgba(74,21,3,.36),transparent 65%);height:624px}
.final-cta h2{font-size:70px;font-weight:800;line-height:1;letter-spacing:-.045em;margin:0 0 45px}
.final-cta .composer-wrap{margin:0 auto;width:700px;max-width:100%}
.final-cta .composer-tabs{width:176px;margin-left:auto;margin-right:auto;gap:2px}
.final-cta .composer-tabs>button{padding:8px 18px;display:flex;align-items:center;justify-content:center}
.final-cta .composer-panel{padding:12px;min-height:168px;border-radius:20px;border-color:#3c332c;background:#111}
.final-cta .composer-input{height:104px;min-height:104px}
.final-cta textarea{height:88px}
@media(max-width:640px){.final-cta{height:675px;padding:64px 20px}.final-cta h2{font-size:43px;line-height:1.03;margin-bottom:35px}.final-cta .composer-tabs{width:170px}.final-cta .composer-panel{padding:12px;min-height:264px}.final-cta .composer-input{height:110px;min-height:110px}.final-cta .composer-controls{min-height:128px}}
}
@scope (.reference-layout){
@media(max-width:767px){.models-section .section-heading p{font-size:13px;line-height:25.2px}}
}
@scope (.reference-layout){
@media(min-width:768px){.model-pills a{padding-left:19.7px;padding-right:19.7px}}
@media(max-width:767px){.model-pills a{font-size:12px}.hero .composer-tabs>button{padding-inline:18px}.hero .composer-tabs>button.active{padding-inline:17px}}
}
@scope (.reference-layout){
@media(min-width:768px){.hero h1{min-height:61.9264px}.hero .composer-panel{min-height:180px}}
@media(max-width:767px){.hero.hero{min-height:633px}.hero h1{min-height:83.148px}.hero .composer-panel{min-height:269px}.hero .composer-input{min-height:111px}.hero .composer-controls{min-height:128px}.hero-keyword-subtitle{min-height:40.8px}}
}
@scope (.reference-layout){
@media(min-width:1101px){.models-section{padding-bottom:99px}.models-section .section-heading{margin-bottom:41px}.model-pills a:nth-child(1){width:180px}.model-pills a:nth-child(2){width:218px}.model-pills a:nth-child(3){width:179px}.model-pills a:nth-child(4){width:178px}.model-pills a:nth-child(5){width:223px}.model-pills a:nth-child(6),.model-pills a:nth-child(7){width:280px}.model-pills a:nth-child(8){width:179px}.model-pills a:nth-child(9){width:222px}.model-pills a:nth-child(10){width:224px}}
}
@scope (.reference-layout){@media(max-width:767px){.mobile-section{min-height:783px}}}
@scope (.reference-layout){@media(max-width:767px){.final-cta{padding-top:65px;padding-bottom:63px}}}
