.dre-share-kit-page{
--dre-share-accent:#e85554;
--dre-share-ink:#111;
--dre-share-muted:#626262;
--dre-share-line:#dddddd;
--dre-share-soft:#fafafa;
--dre-share-radius:10px;
}
.dre-share-kit-page .dre-share-page,
.dre-share-kit-page .dre-share-page *{box-sizing:border-box}
.dre-share-kit-page .dre-share-page{
color:var(--dre-share-ink);
font-family:"Raleway",Arial,sans-serif;
font-size:16px;
line-height:1.65;
}
.dre-share-kit-page .dre-share-shell{
width:min(1104px,calc(100% - 40px));
margin:0 auto;
padding:22px 0 82px;
}
.dre-share-kit-page .dre-share-page h1,
.dre-share-kit-page .dre-share-page h2,
.dre-share-kit-page .dre-share-page h3{
font-family:"PT Serif",Georgia,serif;
color:var(--dre-share-ink);
}
.dre-share-kit-page .dre-share-page button,
.dre-share-kit-page .dre-share-page input,
.dre-share-kit-page .dre-share-page textarea{
font-family:"Raleway",Arial,sans-serif;
}
.dre-share-kit-page .dre-share-brand-title{color:#111;font-style:normal;white-space:nowrap}
.dre-share-kit-page .dre-share-brand-title>span{color:var(--dre-share-accent)} .dre-share-kit-page .dre-share-tool-header{
display:flex;
align-items:center;
gap:22px;
padding:0 0 34px;
}
.dre-share-kit-page .dre-share-tool-icon{
display:grid;
place-items:center;
width:72px;
height:72px;
flex:0 0 72px;
overflow:hidden;
border:1px solid #e2e2e2;
border-radius:14px;
background:#fff;
box-shadow:0 5px 18px rgba(0,0,0,.05);
}
.dre-share-kit-page .dre-share-tool-icon img{display:block;width:56px;height:56px;object-fit:contain}
.dre-share-kit-page .dre-share-tool-icon span{font-family:"PT Serif",Georgia,serif;font-size:34px;font-weight:700}
.dre-share-kit-page .dre-share-kicker{
margin:0 0 7px;
font-size:12px;
font-weight:800;
letter-spacing:.08em;
line-height:1.2;
}
.dre-share-kit-page .dre-share-kicker-muted{margin-left:7px;color:#8a8a8a;font-weight:700}
.dre-share-kit-page .dre-share-tool-header h1{
margin:0 0 8px;
font-size:clamp(34px,4.1vw,50px);
font-weight:700;
letter-spacing:-.02em;
line-height:1.08;
}
.dre-share-kit-page .dre-share-times{color:#b8b8b8;font-weight:400}
.dre-share-kit-page .dre-share-tool-header p{
max-width:690px;
margin:0;
color:#5f5f5f;
font-size:16px;
line-height:1.6;
} .dre-share-kit-page .dre-share-section{
padding:38px 0 44px;
border-top:2px solid #111;
}
.dre-share-kit-page .dre-share-section+.dre-share-section{margin-top:4px}
.dre-share-kit-page .dre-share-section-head{margin:0 0 26px}
.dre-share-kit-page .dre-share-section-title{
display:grid;
grid-template-columns:70px minmax(0,1fr);
align-items:start;
gap:0;
}
.dre-share-kit-page .dre-share-step.dre-editorial-rank{
display:block;
min-width:0;
margin:0;
color:#d9d9d9;
font-family:"Raleway",Arial,sans-serif;
font-size:50px;
font-weight:800;
letter-spacing:-2px;
line-height:1;
}
.dre-share-kit-page .dre-share-section h2{
margin:2px 0 0;
font-size:30px;
font-weight:700;
line-height:1.18;
}
.dre-share-kit-page .dre-share-section-head>p{
max-width:760px;
margin:8px 0 0 70px;
color:#666;
font-size:16px;
line-height:1.6;
text-align:left;
} .dre-share-kit-page .dre-badge-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.dre-share-kit-page .dre-badge-card{
overflow:hidden;
border:1px solid var(--dre-share-line);
border-radius:10px;
background:#fff;
box-shadow:0 3px 12px rgba(0,0,0,.025);
}
.dre-share-kit-page .dre-badge-preview{
display:grid;
place-items:center;
min-height:275px;
padding:32px;
background:transparent!important;
}
.dre-share-kit-page .dre-badge-preview--light,
.dre-share-kit-page .dre-badge-preview--dark{background:transparent!important}
.dre-share-kit-page .dre-badge-preview img{
display:block;
width:min(100%,390px);
height:auto;
max-height:225px;
object-fit:contain;
}
.dre-share-kit-page .dre-badge-card-foot{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
padding:14px 15px;
border-top:1px solid var(--dre-share-line);
background:#fff;
}
.dre-share-kit-page .dre-badge-card-foot strong{font-size:13px}
.dre-share-kit-page .dre-share-button-row{display:flex;align-items:center;gap:7px}
.dre-share-kit-page .dre-share-button-row button,
.dre-share-kit-page .dre-share-secondary,
.dre-share-kit-page .dre-share-url-row button,
.dre-share-kit-page .dre-share-url-row a{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:36px;
padding:8px 11px;
border:1px solid #d2d2d2;
border-radius:6px;
background:#fff;
color:#111!important;
font-size:12px;
font-weight:700;
line-height:1.1;
text-decoration:none!important;
cursor:pointer;
}
.dre-share-kit-page .dre-share-button-row button:hover,
.dre-share-kit-page .dre-share-secondary:hover,
.dre-share-kit-page .dre-share-url-row button:hover,
.dre-share-kit-page .dre-share-url-row a:hover{border-color:#888;background:#fafafa} .dre-share-kit-page .dre-social-layout{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:16px;
}
.dre-share-kit-page .dre-social-preview{
width:min(100%,500px);
aspect-ratio:1;
overflow:hidden;
border:1px solid var(--dre-share-line);
border-radius:9px;
background:#fff;
box-shadow:0 7px 24px rgba(0,0,0,.04);
}
.dre-share-kit-page .dre-social-preview img{display:block;width:100%;height:100%;object-fit:contain}
.dre-share-kit-page .dre-social-copy-side{width:min(100%,500px)}
.dre-share-kit-page .dre-social-copy-side p{
margin:0 0 12px;
color:#555;
font-size:15px;
line-height:1.6;
}
.dre-share-kit-page .dre-share-primary{
display:inline-flex;
align-items:center;
justify-content:center;
min-height:42px;
padding:10px 16px;
border:1px solid #111;
border-radius:6px;
background:#111;
color:#fff;
font-size:12px;
font-weight:800;
cursor:pointer;
}
.dre-share-kit-page .dre-share-primary:hover{background:#272727}
.dre-share-kit-page .dre-share-primary:disabled{cursor:wait;opacity:.6} .dre-share-kit-page .dre-share-copy-field{
display:block;
width:100%;
min-height:170px;
margin:0 0 12px;
padding:18px 19px;
resize:vertical;
border:1px solid #d8d8d8!important;
border-radius:8px;
outline:0;
background:#fafafa;
box-shadow:none!important;
color:#222;
font-size:16px!important;
line-height:1.7;
}
.dre-share-kit-page .dre-share-mention-tip{
margin:0 0 12px;
color:#777;
font-size:13px;
line-height:1.55;
}
.dre-share-kit-page .dre-share-url-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
.dre-share-kit-page .dre-share-url-row input{
min-width:0;
min-height:42px;
padding:9px 13px;
border:1px solid #d8d8d8!important;
border-radius:6px;
outline:0;
background:#fafafa;
box-shadow:none!important;
color:#444;
font-size:14px;
}
@media(max-width:760px){
.dre-share-kit-page .dre-share-shell{width:min(100% - 28px,1104px);padding:18px 0 64px}
.dre-share-kit-page .dre-share-tool-header{align-items:flex-start;gap:15px;padding-bottom:28px}
.dre-share-kit-page .dre-share-tool-icon{width:58px;height:58px;flex-basis:58px;border-radius:12px}
.dre-share-kit-page .dre-share-tool-icon img{width:44px;height:44px}
.dre-share-kit-page .dre-share-section-title{grid-template-columns:52px minmax(0,1fr)}
.dre-share-kit-page .dre-share-step.dre-editorial-rank{font-size:38px}
.dre-share-kit-page .dre-share-section-head>p{margin-left:52px}
.dre-share-kit-page .dre-badge-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
.dre-share-kit-page .dre-share-tool-header h1{font-size:31px}
.dre-share-kit-page .dre-share-section{padding:30px 0 36px}
.dre-share-kit-page .dre-share-section-title{grid-template-columns:44px minmax(0,1fr)}
.dre-share-kit-page .dre-share-step.dre-editorial-rank{font-size:34px}
.dre-share-kit-page .dre-share-section h2{font-size:25px}
.dre-share-kit-page .dre-share-section-head>p{margin-left:44px;font-size:15px}
.dre-share-kit-page .dre-badge-preview{min-height:220px;padding:20px}
.dre-share-kit-page .dre-badge-card-foot{align-items:flex-start;flex-direction:column}
.dre-share-kit-page .dre-share-button-row{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}
.dre-share-kit-page .dre-share-copy-field{font-size:15px!important}
.dre-share-kit-page .dre-share-url-row{grid-template-columns:1fr 1fr}
.dre-share-kit-page .dre-share-url-row input{grid-column:1/-1}
.dre-share-kit-page .dre-share-url-row button,.dre-share-kit-page .dre-share-url-row a{width:100%}
} .dre-share-kit-page .dre-share-shell{padding:4px 0 82px}
.dre-share-kit-page .dre-share-tool-header{padding:0 0 26px}
.dre-share-kit-page .dre-share-section{
padding:34px 0 38px;
border-top:1px solid #e4e4e4;
}
.dre-share-kit-page .dre-share-section+.dre-share-section{margin-top:0}
.dre-share-kit-page .dre-share-step.dre-editorial-rank{color:#d4d4d4}
.dre-share-kit-page .dre-social-preview{width:min(100%,520px)}